React Native中的`fetch`不会从URL返回预期的数据

Question

我想使用fetch()API从React Native Application中的URL加载数据.具体来说,我想从Hackernews Jobs页面加载所有项目.

如其API文档中所述,相应的调用必须转到URL: https://hacker-news.firebaseio.com/v0/jobstories.json

在浏览器中导航到此URL时,我会按预期收到一个简单的javascript数组ID:

[11379939,11379294,11378554,11377293,11375582,11373919,11372195,11371135,11369985,11369460,11361426,11357881,11356669,11354578,11351786,11350273,11349328,11347911,11346192,11343590,11342818,11342137,11341262,11340129]

但是,当我想使用以下方法在我的React Native应用程序中加载数据时,我没有收到通过浏览器发送请求时获得的相同javascript数组.

export const fetchJobs = () => {
  return (dispatch) => {
    return fetch('https://hacker-news.firebaseio.com/v0/jobstories.json', {
      method: 'GET',
      headers: {
        'Accept': 'application/json'
      }
    })
    .then( (response) => {
      console.log('Actions - fetchJobs - received response: ', response)
      const json = JSON.parse(response)
    })
    .then( (jobs) => {
      console.log('Actions - fetchJobs - received jobs: ', jobs)
      dispatch(receiveJobs(jobs))
    })
    .catch( (error) => {
      console.warn('Actions - fetchJobs - recreived error: ', error)
    })
  }
}

我打电话fetchJobs()使用dispatch的终极版在我最初的阵营组成,如下所示:

componentDidMount() {
   var fetchJobsAction = fetchJobs()
   console.log('JobsRootComponent - fetch jobs: ' + fetchJobsAction)
   const { dispatch } = this.props
   dispatch( fetchJobs() )
}

但是,在Chrome调试控制台中检查输出时,输出如下所示:

有人可以告诉我为什么我从浏览器发送的请求和我的React Native应用程序之间的响应内容有所不同吗？

更新:根据评论中的要求,我现在也打印出来response.json(),给我以下结果:

实际上,阵列数据现在似乎就在那里.但是我仍然不明白我是如何从我现在的位置访问它的...

Answer 1

fetch的响应有它自己的JSON解析函数,只是调用 response.json()它将返回一个新的Promise.

fetch('https://hacker-news.firebaseio.com/v0/jobstories.json')
  .then(reponse => response.json())
  .then(json => console.log(json))