訪問和返回對象內的對象數組時出現類型錯誤

這是我的JSON：

"student_clubs": { // brought in as object 
     "art": { // object 
     "illustration": ["Done"], // Array 
     "design": ["Done"] // Array 
     }, 
     "sports": { // object 
     "Basketball": ["Incomplete"], // Array 
     "Hockey": ["Done"] // Array 
     } 
    },

我想是這樣顯示的：

art: 
illustration: done  design: done 

sports: 
Basketball: Incomplete Hockey: Done

我JSX：

import React, { PropTypes } from 'react'; 


const ClubsPropTypes = { 
    student_clubs: PropTypes.object.isRequired, 
    student_grades: PropTypes.object.isRequired, 
}; 

class Clubs extends React.Component { 


    render() { 
    const StudentClubs = this.props.student_clubs; 
    const Grades = this.props.grades; 


    return (
     <div className=""> 
      {(StudentClubs.art || []).map(art => (
        <div className="row"> 
         <ul> 
          <p>art</p> 
          <li>illustration: {art.illustration}</li> 
          <li>design: {art.design}</li> 
         </ul> 
        </div> 
       ))} 
      ... same code for sports (seems repetitive) 
     </div> 
    ); 
    } 
} 

Clubs.propTypes = ClubsPropTypes; 

module.exports = Clubs;

現在我越來越Uncaught TypeError: (StudentClubs.art || []).map is not a function 。這是爲什麼？我怎樣才能解決這個問題？還有更好的方法來循環這些對象嗎？：\

來源

2016-05-06 Modelesq

藝術是一個不是數組的對象，您需要使用Object.keys（）將其轉換爲數組 –

StudentClubs.art是一個對象，所以你不能使用它與地圖。

您可以遍歷使用Object.keys()，它返回對象鍵的一個數組的對象，請參閱：https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/keys

您可以遍歷像一個對象鍵：

Object.keys(myobject).map((key) => { 
    // do stuff with myobject[key] 
})

或者使用in，見：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for...in

如：

for (let key in myobject) { 
    if (myobject.hasOwnProperty(key)) { 
    // do stuff with myobject[key] 
    } 
}

那麼你可以遍歷不同的俱樂部，併爲每個俱樂部循環其鍵 - 顯示鍵名和值列表（例如，「完成」）。

如果可以，請調整您的JSON，以便student_clubs是一個對象數組，每個對象數組都包含一個包含子類別字符串和狀態字符串的對象數組。你不需要一個完成/不完整的數組。

來源

2016-05-06 15:26:25 Marty

-1

在你的json藝術屬性不是一個數組，是一個對象，並且對象沒有地圖功能。
我不明白爲什麼你可能想要一個數組來指定子屬性（運動或藝術）的狀態。我會做如下：

"student_clubs": [{ 
    "art":[ 
    { 
     "discipline":"illustration", 
     "status: "Done" 
    }, 
    { 
     "discipline:"Design", 
     "status":"Done" 
    } 
    ], 
    "sports":[ 
    { 
     "discipline":"Basketball", 
     "status":"Incomplete" 
    }, 
    { 
     "discipline":"Hockey", 
     "status":"whatever" 
    } 
    ] 
]}

所以現在你可以映射througth每個俱樂部，每個俱樂部裏，你可以映射througth每個「紀律」，做任何你想在一個更簡單的方法，我認爲。

來源

2016-05-06 15:30:39 jgldev

不幸的是，我無法更改json響應。 – Modelesq

訪問和返回對象內的對象數組時出現類型錯誤

回答

相關問題