从Express API反应映射数组

时间:2019-01-18 04:48:54

标签: json reactjs express

我无法在React中映射来自Express API的数据。

我以前从Express API服务映射数据没有问题,但是我认为数据以2d数组或其他形式显示。我尝试像二维数组[0] [0]一样访问它,但是没有用。我可以在阵列中的Google Chrome中查看数据。

我从邮递员那里得到了JSON格式的数据。

非常感谢您的帮助。

反应班:

class ScoreData extends React.Component{

constructor(props) {
    super(props);
    this.state = {
        selectedWeek: 1,
        selectedSeason: 2015,
        scoreData:[]            
    };
}

componentDidMount(){
    fetch('/users/2015/1')
    .then(res => res.json())
    .then(dataArray => this.setState({scoreData: dataArray.data})); 

}

地图功能:

return (
<div>
    <h1>NFL Score Data</h1>

    <button onClick={this.handleButtonClick}>Click me</button>

    {this.state.scoreData[0].map(currentScoreData=>
        <div >
            <p>{currentScoreData.PK_GameID}</p>
            <p>{currentScoreData.homeTeamPoints}</p>
            <p>{currentScoreData.awayTeamPoints}</p>
            <p>{currentScoreData.gameDate}</p>
            <p>{currentScoreData.FK_AwayTeamID}</p>
            <p>{currentScoreData.FK_HomeTeamID}</p>
        </div>
    )}

{

    "data": [
        [
            {
                "PK_GameID": 1591,
                "homeTeamPoints": 0,
                "awayTeamPoints": 10,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 31,
                "FK_HomeTeamID": 3
            },
            {
                "PK_GameID": 1591,
                "homeTeamPoints": 0,
                "awayTeamPoints": 17,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 31,
                "FK_HomeTeamID": 3
            },
            {
                "PK_GameID": 1591,
                "homeTeamPoints": 8,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 31,
                "FK_HomeTeamID": 3
            },
            {
                "PK_GameID": 1591,
                "homeTeamPoints": 0,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 31,
                "FK_HomeTeamID": 3
            },
            {
                "PK_GameID": 1595,
                "homeTeamPoints": 7,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 6,
                "FK_HomeTeamID": 4
            },
            {
                "PK_GameID": 1595,
                "homeTeamPoints": 9,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 6,
                "FK_HomeTeamID": 4
            },
            {
                "PK_GameID": 1595,
                "homeTeamPoints": 7,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 6,
                "FK_HomeTeamID": 4
            },
            {
                "PK_GameID": 1595,
                "homeTeamPoints": 10,
                "awayTeamPoints": 10,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 6,
                "FK_HomeTeamID": 4
            },
            {
                "PK_GameID": 1589,
                "homeTeamPoints": 0,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 27,
                "FK_HomeTeamID": 5
            },
            {
                "PK_GameID": 1589,
                "homeTeamPoints": 3,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 27,
                "FK_HomeTeamID": 5
            },
            {
                "PK_GameID": 1589,
                "homeTeamPoints": 0,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 27,
                "FK_HomeTeamID": 5
            },
            {
                "PK_GameID": 1589,
                "homeTeamPoints": 7,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 27,
                "FK_HomeTeamID": 5
            },
            {
                "PK_GameID": 1602,
                "homeTeamPoints": 3,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-14T05:00:00.000Z",
                "FK_AwayTeamID": 2,
                "FK_HomeTeamID": 8
            },
            {
                "PK_GameID": 1602,
                "homeTeamPoints": 14,
                "awayTeamPoints": 10,
                "gameDate": "2015-12-14T05:00:00.000Z",
                "FK_AwayTeamID": 2,
                "FK_HomeTeamID": 8
            },
            {
                "PK_GameID": 1602,
                "homeTeamPoints": 7,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-14T05:00:00.000Z",
                "FK_AwayTeamID": 2,
                "FK_HomeTeamID": 8
            },
            {
                "PK_GameID": 1602,
                "homeTeamPoints": 7,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-14T05:00:00.000Z",
                "FK_AwayTeamID": 2,
                "FK_HomeTeamID": 8
            },
            {
                "PK_GameID": 1594,
                "homeTeamPoints": 3,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 25,
                "FK_HomeTeamID": 9
            },
            {
                "PK_GameID": 1594,
                "homeTeamPoints": 10,
                "awayTeamPoints": 6,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 25,
                "FK_HomeTeamID": 9
            },
            {
                "PK_GameID": 1594,
                "homeTeamPoints": 3,
                "awayTeamPoints": 21,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 25,
                "FK_HomeTeamID": 9
            },
            {
                "PK_GameID": 1594,
                "homeTeamPoints": 0,
                "awayTeamPoints": 21,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 25,
                "FK_HomeTeamID": 9
            },
            {
                "PK_GameID": 1590,
                "homeTeamPoints": 0,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 28,
                "FK_HomeTeamID": 10
            },
            {
                "PK_GameID": 1590,
                "homeTeamPoints": 0,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 28,
                "FK_HomeTeamID": 10
            },
            {
                "PK_GameID": 1590,
                "homeTeamPoints": 7,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 28,
                "FK_HomeTeamID": 10
            },
            {
                "PK_GameID": 1590,
                "homeTeamPoints": 7,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 28,
                "FK_HomeTeamID": 10
            },
            {
                "PK_GameID": 1603,
                "homeTeamPoints": 3,
                "awayTeamPoints": 14,
                "gameDate": "2015-12-17T05:00:00.000Z",
                "FK_AwayTeamID": 23,
                "FK_HomeTeamID": 10
            },
            {
                "PK_GameID": 1603,
                "homeTeamPoints": 0,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-17T05:00:00.000Z",
                "FK_AwayTeamID": 23,
                "FK_HomeTeamID": 10
            },
            {
                "PK_GameID": 1603,
                "homeTeamPoints": 3,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-17T05:00:00.000Z",
                "FK_AwayTeamID": 23,
                "FK_HomeTeamID": 10
            },
            {
                "PK_GameID": 1603,
                "homeTeamPoints": 17,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-17T05:00:00.000Z",
                "FK_AwayTeamID": 23,
                "FK_HomeTeamID": 10
            },
            {
                "PK_GameID": 1593,
                "homeTeamPoints": 7,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 1,
                "FK_HomeTeamID": 14
            },
            {
                "PK_GameID": 1593,
                "homeTeamPoints": 3,
                "awayTeamPoints": 10,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 1,
                "FK_HomeTeamID": 14
            },
            {
                "PK_GameID": 1593,
                "homeTeamPoints": 10,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 1,
                "FK_HomeTeamID": 14
            },
            {
                "PK_GameID": 1593,
                "homeTeamPoints": 0,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 1,
                "FK_HomeTeamID": 14
            },
            {
                "PK_GameID": 1604,
                "homeTeamPoints": 6,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-19T05:00:00.000Z",
                "FK_AwayTeamID": 3,
                "FK_HomeTeamID": 16
            },
            {
                "PK_GameID": 1604,
                "homeTeamPoints": 3,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-19T05:00:00.000Z",
                "FK_AwayTeamID": 3,
                "FK_HomeTeamID": 16
            },
            {
                "PK_GameID": 1604,
                "homeTeamPoints": 0,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-19T05:00:00.000Z",
                "FK_AwayTeamID": 3,
                "FK_HomeTeamID": 16
            },
            {
                "PK_GameID": 1604,
                "homeTeamPoints": 10,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-19T05:00:00.000Z",
                "FK_AwayTeamID": 3,
                "FK_HomeTeamID": 16
            },
            {
                "PK_GameID": 1601,
                "homeTeamPoints": 7,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 7,
                "FK_HomeTeamID": 17
            },
            {
                "PK_GameID": 1601,
                "homeTeamPoints": 10,
                "awayTeamPoints": 3,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 7,
                "FK_HomeTeamID": 17
            },
            {
                "PK_GameID": 1601,
                "homeTeamPoints": 3,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 7,
                "FK_HomeTeamID": 17
            },
            {
                "PK_GameID": 1601,
                "homeTeamPoints": 7,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 7,
                "FK_HomeTeamID": 17
            },
            {
                "PK_GameID": 1599,
                "homeTeamPoints": 0,
                "awayTeamPoints": 6,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 21,
                "FK_HomeTeamID": 18
            },
            {
                "PK_GameID": 1599,
                "homeTeamPoints": 0,
                "awayTeamPoints": 6,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 21,
                "FK_HomeTeamID": 18
            },
            {
                "PK_GameID": 1599,
                "homeTeamPoints": 9,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 21,
                "FK_HomeTeamID": 18
            },
            {
                "PK_GameID": 1599,
                "homeTeamPoints": 6,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 21,
                "FK_HomeTeamID": 18
            },
            {
                "PK_GameID": 1592,
                "homeTeamPoints": 0,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 11,
                "FK_HomeTeamID": 19
            },
            {
                "PK_GameID": 1592,
                "homeTeamPoints": 0,
                "awayTeamPoints": 10,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 11,
                "FK_HomeTeamID": 19
            },
            {
                "PK_GameID": 1592,
                "homeTeamPoints": 3,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 11,
                "FK_HomeTeamID": 19
            },
            {
                "PK_GameID": 1592,
                "homeTeamPoints": 0,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 11,
                "FK_HomeTeamID": 19
            },
            {
                "PK_GameID": 1596,
                "homeTeamPoints": 7,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 12,
                "FK_HomeTeamID": 22
            },
            {
                "PK_GameID": 1596,
                "homeTeamPoints": 7,
                "awayTeamPoints": 6,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 12,
                "FK_HomeTeamID": 22
            },
            {
                "PK_GameID": 1596,
                "homeTeamPoints": 7,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 12,
                "FK_HomeTeamID": 22
            },
            {
                "PK_GameID": 1596,
                "homeTeamPoints": 14,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 12,
                "FK_HomeTeamID": 22
            },
            {
                "PK_GameID": 1588,
                "homeTeamPoints": 7,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 15,
                "FK_HomeTeamID": 23
            },
            {
                "PK_GameID": 1588,
                "homeTeamPoints": 10,
                "awayTeamPoints": 10,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 15,
                "FK_HomeTeamID": 23
            },
            {
                "PK_GameID": 1588,
                "homeTeamPoints": 7,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 15,
                "FK_HomeTeamID": 23
            },
            {
                "PK_GameID": 1588,
                "homeTeamPoints": 0,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 15,
                "FK_HomeTeamID": 23
            },
            {
                "PK_GameID": 1600,
                "homeTeamPoints": 0,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 16,
                "FK_HomeTeamID": 26
            },
            {
                "PK_GameID": 1600,
                "homeTeamPoints": 0,
                "awayTeamPoints": 14,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 16,
                "FK_HomeTeamID": 26
            },
            {
                "PK_GameID": 1600,
                "homeTeamPoints": 7,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 16,
                "FK_HomeTeamID": 26
            },
            {
                "PK_GameID": 1600,
                "homeTeamPoints": 0,
                "awayTeamPoints": 14,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 16,
                "FK_HomeTeamID": 26
            },
            {
                "PK_GameID": 1598,
                "homeTeamPoints": 7,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 13,
                "FK_HomeTeamID": 29
            },
            {
                "PK_GameID": 1598,
                "homeTeamPoints": 7,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 13,
                "FK_HomeTeamID": 29
            },
            {
                "PK_GameID": 1598,
                "homeTeamPoints": 7,
                "awayTeamPoints": 14,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 13,
                "FK_HomeTeamID": 29
            },
            {
                "PK_GameID": 1598,
                "homeTeamPoints": 3,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 13,
                "FK_HomeTeamID": 29
            },
            {
                "PK_GameID": 1597,
                "homeTeamPoints": 0,
                "awayTeamPoints": 21,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 24,
                "FK_HomeTeamID": 30
            },
            {
                "PK_GameID": 1597,
                "homeTeamPoints": 0,
                "awayTeamPoints": 7,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 24,
                "FK_HomeTeamID": 30
            },
            {
                "PK_GameID": 1597,
                "homeTeamPoints": 0,
                "awayTeamPoints": 10,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 24,
                "FK_HomeTeamID": 30
            },
            {
                "PK_GameID": 1597,
                "homeTeamPoints": 0,
                "awayTeamPoints": 0,
                "gameDate": "2015-12-13T05:00:00.000Z",
                "FK_AwayTeamID": 24,
                "FK_HomeTeamID": 30
            }
        ],
        {
            "fieldCount": 0,
            "affectedRows": 0,
            "insertId": 0,
            "serverStatus": 2,
            "warningCount": 0,
            "message": "",
            "protocol41": true,
            "changedRows": 0
        }
    ]
}

1 个答案:

答案 0 :(得分:0)

您所拥有的代码在大多数情况下都是正确的,看起来您只需要将嵌套数组添加到默认值即可:

constructor(props) {
    super(props);
    this.state = {
         selectedWeek: 1,
         selectedSeason: 2015,
         scoreData:[ [] ], // <--- this right here
    };
}

或者将scoreData设置为嵌套数组