我发现了一种在ComponentDidMount方法中从XML中提取项并循环它们的方法。我还设法将它们传递到Component的“render”部分，并将它们作为一堵字符串墙返回，但我需要将它们显示为列表，以便一行代码专用于一个项目。
这是我目前的Demo：https://snack.expo.io/@leourushi/api-looping-00
这是我从中提取数据的原始XML：https://www.wmata.com/rider_tools/metro_service_status/feeds/mis/rail.xml的
我使用这个工具将XML解析成可读的格式：https://www.npmjs.com/package/react-native-rss-parser的
我正在尝试创建一个类似于以下的列表视图：https://www.wmata.com/service/status/#lines-affected
我使用Map功能来提取旅游警报的简短标题（黄线，蓝线等）和更详细的描述文本。我将它们分别存储到名为gimmeNames和gimmeDescriptions的变量中。
现在我想在列表视图中并排显示它们。
我在顶部创建了空的状态名称，如下所示：

constructor(props) {
        super(props);
        this.state = {
            rss: [],
            gimmeNames: "",
            gimmeDescriptions: ""
        };
    }

字符串
在componentDidMount中，我定义了原始URL，运行了一个'fetch'操作，并创建了两个循环函数。我将结果定义为gimmeNames和gimmeDescriptions。

componentDidMount() {
var url = 'https://www.wmata.com/rider_tools/metro_service_status/feeds/mis/rail.xml';

    return fetch(url)
  .then((response) => response.text())
  .then((responseData) => rssParser.parse(responseData))
  .then((rss) => {
    const gimmeNames = rss.items.map(function(item, index) {
      return (item.title);
    });
    const gimmeDescriptions = rss.items.map(function(item, index) {
      return (item.description);
    });

this.setState({
  gimmeNames: gimmeNames,
  gimmeDescriptions: gimmeDescriptions,
  rss: rss
});

  });

}

型
这里我尝试将它们并排呈现。但目前我有一大块的所有循环标题名称和另一块的所有描述项。

render() {

  const { rss, gimmeNames, gimmeDescriptions } = this.state;

  return(

<View style={styles.bigContainer}>
<View style={styles.box}>

<Text> Title: Hard coded strings for now </Text>
<View style={styles.lineItem}>
<View style={styles.lineRow}>

<Text style={styles.leftColumn}>{gimmeNames}</Text>
<Text style={styles.rightColumn}>{gimmeDescriptions}</Text>

</View>
</View>
</View>
</View>

    )
}

型
我绝对做错了。但我不知道如何得到正确的答案。任何指针将不胜感激。