ReactJS "未処理の拒否（TypeError）：this.state.features.mapは関数ではありません"

Question

私はリアクションを学んでいます。今ではリザルトとマップでリストを取得しようとしていますが、このエラー "Unhandled Rejection（TypeError）：this.state.features.mapは関数ではありません"で始まります。私はすでにこれを検索しますが、私はそれが何を行っているのかを理解していません。あなたのcomponentWillMountで

import React, { Component } from 'react'; 
import './App.css'; 

class App extends Component { 

    constructor() { 
    super(); 
    this.state = { 
     features: [{ 
     id: 1, 
     name: 'Test', 
     count: 1 
     }] 
    } 
    } 

    componentWillMount() { 
    fetch("http://demo6085176.mockable.io/features") 
     .then(response => response.json()) 
     .then(json => { 
     console.log(json); 
     this.setState({ 
      features: json, 
     }); 
     }); 
    console.log(this.state.features) 

    } 

    render() { 
    return (
     <div className="App"> 
     <ul> 
      { 
      this.state.features.map(function(feature){ 
       return (
       <li key={feature.id}><button type="button">Upvote</button> ({feature.count}) <span>{feature.name}</span></li> 
      ) 
      }) 
      } 
     </ul> 
     </div> 
    ); 
    } 
} 

export default App; 

Answer 1

こんにちはちょうどこの

componentWillMount() { 
    fetch("http://demo6085176.mockable.io/features") 
    .then(response => response.json()) 
    .then(json => { 
     console.log(json); 
     this.setState({ features: json.features }); 
    }); 
} 

を行うあなたは、APIから取得応答が必要なデータのオブジェクトの配列ですfeaturesのキーを持つオブジェクトです。

これが正解であれば、この回答を親切に記入してください。