2016-07-22 7 views
0

XML形式を返すAPIを作成し、ajaxリクエストしています。次のコードでは、responseXmlデータが出力されますが、どのように解析してitem.lineやitem.origTimeのようなデータにアクセスできるのかわかりません。xmlからデータを取得するjs response.text()

何らかの形でJSONパーサーを使用する必要がありますか?ここ

class App extends Component { 
    constructor(props) { 
    super(props); 

    this.state = { schedules: [] }; 

    fetch('http://api.bart.gov/api/sched.aspx?cmd=stnsched&key=' + API_KEY + '&orig=12th&date=today') 
     .then((response) => response.text()) 
     .then((responseXML) => { 
     this.setState({schedules: responseXML}); 
     console.log(responseXML); 
     }) 
     .catch((error) => { 
     console.log(error); 
     }); 
    } 

    render() { 
    return (
     <div> 
     <SelectList /> 
     <TimeTable schedules={this.state.schedules} /> 
     </div> 
    ) 
    } 
} 

XML応答

<root> 
    <uri>...</uri> 
    <date>7/22/2016</date> 
    <sched_num>39</sched_num> 
    <station> 
    <name>12th St. Oakland City Center</name> 
    <abbr>12TH</abbr> 
    <item line="ROUTE 7" trainHeadStation="MLBR" origTime="4:36 AM" destTime="5:21 AM" trainIdx="1" bikeflag="1"/> 
    <item line="ROUTE 2" trainHeadStation="PITT" origTime="4:37 AM" destTime="5:17 AM" trainIdx="1" bikeflag="1"/> 
    <item line="ROUTE 3" trainHeadStation="RICH" origTime="4:37 AM" destTime="5:00 AM" trainIdx="1" bikeflag="1"/> 
    <item line="ROUTE 1" trainHeadStation="SFIA" origTime="4:43 AM" destTime="5:28 AM" trainIdx="1" bikeflag="1"/> 
    ...... 
+0

jxonは何が必要です。 https://github.com/tyrasd/jxon –

+0

Jiang、コードサンプルを書くことができますか? –

答えて

1

コンソール出力を確認し、コードexmapleです: https://jsfiddle.net/5rddp7tx/

const xmlStr=` 
<root> 
    <uri>...</uri> 
    <date>7/22/2016</date> 
    <sched_num>39</sched_num> 
    <station> 
    <name>12th St. Oakland City Center</name> 
    <abbr>12TH</abbr> 
    <item line="ROUTE 7" trainHeadStation="MLBR" origTime="4:36 AM" destTime="5:21 AM" trainIdx="1" bikeflag="1"/> 
    <item line="ROUTE 2" trainHeadStation="PITT" origTime="4:37 AM" destTime="5:17 AM" trainIdx="1" bikeflag="1"/> 
    <item line="ROUTE 3" trainHeadStation="RICH" origTime="4:37 AM" destTime="5:00 AM" trainIdx="1" bikeflag="1"/> 
    <item line="ROUTE 1" trainHeadStation="SFIA" origTime="4:43 AM" destTime="5:28 AM" trainIdx="1" bikeflag="1"/> 
    </station> 
</root> 
` 
var myObject = JXON.build(JXON.stringToXml(xmlStr)); 
console.log(myObject); 
console.log(myObject.root.station.item[2].$line); 
関連する問題