從axios API檢索的javascript中的JSON中的沖浪對象數組

Question

我將Axios例如API稱為react，我想僅在數組中呈現特定字段，例如僅在輸出中呈現第一人稱公司名稱。 例如“ person [0] .cpmpany.name”，我希望有“ Romaguera-Crona”，但出現錯誤。

[
  {
    "id": 1,
    "name": "Leanne Graham",
    "address": {
      "street": "Kulas Light",
      "zipcode": "92998-3874",
      }
    },
    "phone": "1-770-736-8031 x56442",
    "website": "hildegard.org",
    "company": {
      "name": "Romaguera-Crona",
      "catchPhrase": "Multi-layered client-server neural-net",
    }
  },
  {
    "id": 2,
    "name": "Ervin Howell",
    "address": {
      "street": "Victor Plains",
      "zipcode": "92998-3874",
    },
    "phone": "010-692-6593 x09125",
    "website": "anastasia.net",
    "company": {
      "name": "Deckow-Crist",
      "catchPhrase": "Proactive didactic contingency",
    }
  },...]

我的反應成分是：

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> export default class PersonList extends React.Component { state = { persons: [] }; componentDidMount() { axios.get(`https://jsonplaceholder.typicode.com/users`) .then(res => { const persons = res.data; // const persons2 = JSON.parse(persons); this.setState({ persons : persons}); }) } render() { return ( <ul> { this.state.persons.map(person => <li>{person.phone}</li>)} { this.state.persons.map(person => <li>{person.address.street}</li>)} // { this.state.persons.map(person => <li>{person[0].cpmpany.name}</li>)} // here is the issue }) </ul> ) } } 

我想從JSON文件呈現特定組件，或者在5月JSON對象中的特定單元格上循環。 例如只渲染person.cpmpany.name的for循環

Answer 1

{person[0].cpmpany.name}有一個錯字。 另外，由於您已經在this.state.persons數組上進行映射， this.state.persons可以簡單地使用{person.company.name} 。

請嘗試將{person[0].cpmpany.name}替換為{person.company.name}