如何从URL数组中获取内容是本机的

时间:2017-11-10 13:28:47

标签: javascript reactjs react-native

我正在尝试从多个Feed中获取数据并将其存储在数组中。

网址:

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: []
    }
  }

从Feed中提取标题和说明的功能

extractData(text) {
    var doc = new DOMParser().parseFromString(text, 'text/xml');
    var items_array = [];
    var items = doc.getElementsByTagName('item');

    for (var i = 0; i < items.length; i++) {
      items_array.push({
        title: items[i].getElementsByTagName('title')[0].lastChild.data,
        description: items[i].getElementsByTagName('description')[0].lastChild.data,                  
      })
    }
    return items_array;
  }

获取数据的代码:

fetchData() {
    return Promise.all(
      URLS.map(url => fetch(url)
        .then(response => response.text())
        .then(responseData => {
          this.setState(
            (prevState, props) => ({
              data: [...prevState.data, this.extractData(responseData)]
            })
          );
        })
        .catch(err => console.error(err))
      )
    ).then(() => { /* do some thing */ }, err => { console.error(err) }) 
  }

问题是数据没有显示在列表中,但是如果我添加测试数据,如下面的代码就显示正常:data: [...prevState.data, {title: "t1", description: "d1"}, {title: "t2", description: "d2"}]

1 个答案:

答案 0 :(得分:2)

逻辑似乎工作得很好,但是你没有正确使用传播运算符:

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

const data = [1,2,3,4]
const extraElements = [5,6,7,8]
const result = [...data, ...extraElements]

console.log(result)