适当的方式来使用fetch与github api v3？

我想映射回购的所有问题标题并将它们呈现给反应组件中的li。我已经能够使用octokat库仅提取问题标题，但不幸的是，图书馆不能很好地与我正在进行的其他一些东西玩。另外，我确定我可以用es6和fetch API来做到这一点。适当的方式来使用fetch与github api v3？

原贴：

一直有一个hellava时间使用ES6读取/与GitHub的API承诺寻找信息。我试图为回购提取问题，但我明显错过了一些东西......我已经使用了几个不同的库来尝试完成此操作，但我只想使用提取。

更新：现在我的新目标仅仅是console.log标题...婴儿的步骤。

import React from "react"; 

export default class extends React.Component { 
    constructor() { 
    super() 
    this.state = { 
     issues: [] 
    } 
    } 
    componentWillMount() { 
    // let issueArry = [] 
    const url = "https://api.github.com/repos/fightplights/chode-stream/issues" 
    fetch(url) 
     .then(response => response) // i've tried with and without .json() 
     .then(body => console.log(body)) 
     // this logs the same response 

    } 
    render() { 
    return (
     <div> 
     <ul> 
      {here i will map this.state.issues (once i can get them =))} 
     </ul> 
     </div> 
    ) 
    } 
}

我知道这是我的一个简单的错误。我还是一个刚刚起步的人。 =）

...，显然我需要渲染的DOM（这里没有显示）

@Andy_D是正确的，我不解析响应的主体，只有响应本身（DOH！）但是现在我试图data.map（issue => ...）我仍然得到data.map（）不是函数的错误。这使我相信，数据对象不是机器人在屏幕

这里的前找... 手波的对象在第一个承诺响应对象：

Response { type: "cors", url: "https://api.github.com/repos/fightp…", redirected: false, status: 200, ok: true, statusText: "OK", headers: Headers, bodyUsed: false }

但（data => console.log（data））它是未定义的... 我已经尝试返回第一个响应=> response.json（）（as安迪建议），但是当我在接下来的。它已经是JSON了...我错了吗？

来源

2017-04-03 archae0pteryx

您的浏览器devtools控制台显示什么错误消息？或者正在发生或未发生的事情与您期望的不同？请使用https://stackoverflow.com/posts/43174868/edit来编辑/更新您的问题，以包括该信息 – sideshowbarker

也许没有设置响应json？我可以只传递响应：.then（response）.then（）？ – archae0pteryx

您需要从响应正文中读取JSON，您试图呈现的是完整响应正文。

所以：

fetch(url) 
    .then(response => response.json()) 
    .then(data => data.map(...)

response.json()返回一个承诺，所以你可以.then它，返回值（data）将是您正在寻找的JS对象/数组。
https://developer.mozilla.org/en-US/docs/Web/API/Body/json

来源

2017-04-03 00:23:31

我的方法Andy仍然出错。它告诉我，data.map（）不是一个函数。我使用你的方法更新了我的示例。 – archae0pteryx

检查开发工具中的网络请求并查看响应。也许这是一个没有内容的200。 “bodyUsed”是虚假的事实是可疑的。 –

是的。我同意！我可能会不小心将我的API令牌推送给gh，并将其撤销。我需要做一些挖掘... – archae0pteryx

适当的方式来使用fetch与github api v3？

回答

相关问题