Javascript 如何从多个URL获取数据并将其保存在数组中（react native）

我有一个RSS URL数组，我想从中获取数据并将数据保存在一个数组中。这是我的密码：

// rss urls array
var URLS = [
  "https://www.wired.com/feed/rss",
  "http://feeds.bbci.co.uk/news/rss.xml",
  "http://www.nasa.gov/rss/dyn/breaking_news.rss"
];

在我的状态中有一个数据变量，我希望在其中存储数据

constructor() {
    super()
    this.state = {
      data: []
    }
  }

我使用

fetchData（）

函数尝试获取数据

  fetchData() {
    var urlArray = [];

    for (var i = 0; i < URLS.length; i++) {
      urlArray.push(URLS[i]);
    }

    fetch(urlArray)
      .then((response) => response.text())
      .then((responseData) => {
        this.setState({
          data: this.extractData(responseData)
        });
      }).done();
  }


  componentDidMount() {
    this.fetchData();
  }

---

但是当我运行时，我收到一个错误，提示“无法加载空URL”

您正在将数组传递给

fetch（）

，而不是字符串或

请求

对象。您可以使用

Promise

all或

async/await

和循环对

fetch（）

进行多次调用，并在所有请求完成时获得结果，或者在任何其他请求抛出错误时记录错误。您还可以处理错误并继续循环以获取成功的请求和错误消息

  fetchData() {    
    return Promise.all(
      URLS.map(url => 
        fetch(url)
        .then(response => response.text())
        .then(responseData => {
          this.setState({
            data: this.extractData(responseData)
          })
        })
        .catch(err => /* handle errors here */ console.error(err))
      )
    ).then(() => {// do stuff}, err => {// handle error})
  }

---

从问题中不清楚什么是

.done（）

，或者调用

.done（）

的预期结果是什么。

您向

fetch（）

传递的是数组，而不是字符串或

请求

对象。您可以使用

Promise

all或

async/await

和循环对

fetch（）

进行多次调用，并在所有请求完成时获得结果，或者在任何其他请求抛出错误时记录错误。您还可以处理错误并继续循环以获取成功的请求和错误消息

  fetchData() {    
    return Promise.all(
      URLS.map(url => 
        fetch(url)
        .then(response => response.text())
        .then(responseData => {
          this.setState({
            data: this.extractData(responseData)
          })
        })
        .catch(err => /* handle errors here */ console.error(err))
      )
    ).then(() => {// do stuff}, err => {// handle error})
  }

---

从问题中不清楚什么是

.done（）

，或者调用

.done（）

的预期结果是什么。

除了@guest271314 answer之外，还可以将setState调用修改为

this.setState((prevState, props) => ({ data: [...prevState.data, this.extractData(responseData)] })

---

在以前的代码中，每次请求完成时都会覆盖数据数组。在上面的代码片段中，您可以看到它正在将新响应添加到以前的数组中。

除了@guest271314 answer之外，还可以将setState调用修改为

this.setState((prevState, props) => ({ data: [...prevState.data, this.extractData(responseData)] })

---

在以前的代码中，每次请求完成时都会覆盖数据数组。在上面的代码片段中，您可以看到它正在向以前的数组添加新的响应。

您可以尝试

url.map（url=>fetch（url）。然后（res=>res.text（））。然后（extractData）。然后（items=>this.setState（{data:this.state.data.push（…items）}））

您可以尝试

url.map（url=>fetch（url）。然后（res=>res.text（））。然后（extractData）。然后（items=>this.setState（{data:this.state.data.push（…items）}））

现在正在获取所有请求，但它们似乎覆盖了以前的数据，而不是将其全部添加到数组中。这可能与

this.setState（{data:this.extracteddata（responseData）}）处的reactjs代码有关

，他们在使用方面的经验有限。

数据

在

this.setState（{data:this.extracteddata（responseData）}

？现在正在提取所有请求，但它们似乎覆盖了以前的数据，而不是将所有数据添加到数组中。这可能与

this.setState（{data:this.extractData（responseData）}）处的reactjs代码有关

，它们在使用方面的经验有限。在

this.setState（{data:this.extractData（responseData）}

）上使用

data

的预期结果是什么？当我指定索引时，它只显示列表上的3项

this.setState（（prevState，props）=>（{data:[…prevState.data，this.extractData）（responseData）[0]]}

谢谢我设法解决了这个问题，我不得不这样做：

数据：[…prevState.data，…this.extractData（responseData）]

当我指定索引时，它只显示列表中的3项

this.setState（（prevState，props）=>（{data:[…prevState.data，this.extractData（responseData）[0]}）

谢谢，我设法解决了这个问题，我不得不这样做：

data:[…prevState.data，…this.extractData（responseData）]