Question

我有以下代码：

class App extends Component {

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

  componentDidMount() {
    fetch('https://api.coinmarketcap.com/v1/ticker/')
    .then(response=>response.json())
    .then(data => this.setState({coins: data}));
  }


  render() {
    const test = this.state.coins[0];
    console.log(test);
    return (
      ...
    );
  }
}

export default App;

test返回一个带有id，name等的对象，如下所示：

{id: "bitcoin", name: "Bitcoin", symbol: "BTC", rank: "1", price_usd: "6545.84", …}

如何访问名称或ID？我尝试了console.log（test.id）或console.log（test [“id”]但他们一直给我错误。

这是我得到的错误：

TypeError: Cannot read property 'id' of undefined
App.render
src/App.js:23
  20 | 
  21 | render() {
  22 |   const test = this.state.coins[0];
> 23 |   console.log(test.id);
  24 |   return (
  25 |     <div className="App">
  26 |       <header className="App-header">

由于

Answer 1

执行提取asynchronously。所以，你的componentDidUpdate应该是：

async componentDidMount() {
    async fetch('https://api.coinmarketcap.com/v1/ticker/')
    .then(response=>response.json())
    .then(data => this.setState({coins: data}));
}

您遇到的问题是由于当您尝试获取硬币时，请求尚未完成。 fetch()和this.setState()是异步方法。

无法从coinmarketcap（reactjs）引用该对象

1 个答案: