자바스크립트 개발자 포럼안녕하세요
개발 관련해서 지식이 별로 없지만 한번 앱같은거 만들어보고 싶어서
react native를 통해서 버스앱을 한번 만들어보려고 합니다
자바 스크립트는 배운적이 없어서 인터넷을 참고하면서 만들고 있는데
인터넷에 날씨앱 만드는 관련 정보가 있어서 그거 보면서 하고 있습니다.
api를 통해 xml 정보를 읽어오는 함수를 만들고 있는데
인터넷에 xmlDoc관련 내용을 따라하다보니
xml에 있는 모든 정보를 읽어오는게 아닌
하나의 정보만 읽어오네요
console.log(xmlDoc.getElementsByTagName(“stationId”)[0].childNodes[0].nodeValue);
이부분에서 .childNodes 앞에 있는 [0]의 숫자위치에 있는 stationId를 읽어오는것 같은데
xml에 있는 모든 stationId를 읽어들이고 싶은데 어떻게 하면 될까요?
아는게 없어서 찾아서만 하니까 좀 힘드네요 ㅠㅠ
아래는 여태까지 작성한 App.js의 코드 내용입니다.
import React, { Component } from ‘react’;
import {Alert, TextInput, StyleSheet, View, Text, Button} from “react-native”;
import { render } from ‘react-dom’;
import Loading from “./Loading”;
import * as Location from “expo-location”;
import axios from “axios”;
window.DOMParser = require(‘xmldom’).DOMParser;
const API_KEY = " ";
export default class extends React.Component {
state = {
isLoading: true,
}
getBusStationAroundList = async (latitude, longitude) => {
var Url = http://apis.data.go.kr/6410000/busstationservice/getBusStationAroundList?serviceKey=${API_KEY}&x=${longitude}&y=${latitude}
const { data } = await axios.get(Url);
const parser = new DOMParser();
const xmlDoc = parser.parseFromString(data);
console.log(xmlDoc.getElementsByTagName("stationId")[0].childNodes[0].nodeValue);
}
getLocation = async () => {
try {
await Location.requestForegroundPermissionsAsync();
const {
coords: { latitude, longitude }
} = await Location.getCurrentPositionAsync();
this.getBusStationAroundList(latitude, longitude);
this.setState({ isLoading: false });
} catch (error) {
Alert.alert(“사용자의 위치를 찾을 수 없습니다”);
}
}
componentDidMount() {
this.getLocation();
}
render() {
const { isLoading } = this.state;
return isLoading ? : null;
}
};