React-Table 不渲染数据

Question

我正在尝试在 react-table 组件中呈现一些数据，但是数据没有加载。我已经用完全相同格式的虚拟数据进行了测试，它工作正常。但是，当我进行 API 调用并获取相同格式的数据并将其推送到我传递给 react-table 的数据列表时，该表不会呈现它。请帮我找出问题所在。干杯设置列：    columns: [      {        Header: "Employee ID",        accessor: "EmployeeID"      },      {        Header: "First Name",        accessor: "FirstName"      },      {        Header: "Last Name",        accessor: "LastName"      },      {        Header: "Date of Birth",        accessor: "DateOfBirth",      },      {        Header: "Status",        accessor: "Status",      },      {        Header: "Gender",        accessor: "Gender",      },      {        Header: "UpdatedDateUTC",        accessor: "UpdatedDateUTC",      }    ]数据是什么样的：{"EmployeeID":"63c571b3-bff0-4ce1-94f7-255c235580fa","FirstName":"Clive","LastName":"Thomas","Status":"ACTIVE","DateOfBirth":"/Date(697248000000+0000)/","Gender":"M","UpdatedDateUTC":"/Date(1533706298000+0000)/"}我的 API 调用以及我如何将数据项保存到状态。（我控制台记录了我获得的数据的值，并且格式正确）fetch('http://localhost:3100/employees')      .then((resp) => {        return resp.json()      })      .then((data) => {        let temp = this.state.posts;        temp.push(data.Employees[1])        this.setState({posts: temp})        console.log(this.state.posts)      })      .catch((error) => {        console.log(error, "catch the hoop")      })我还打印了成功插入列表的虚拟数据以及未插入的 API 数据。如您所见，它们显然是相同的：

Answer 1

不确定这是否会解决您的问题，但 IMO 您应该将其重构为

fetch('http://localhost:3100/employees')

      .then((resp) => {

        return resp.json()

      })

      .then((data) => {

        let temp = [...this.state.posts]

        temp.push(data.Employees[1])

        this.setState({

            posts: temp,

            data: data

        })

        console.log(this.state.posts) //this will not have the newest values yet, setState is async

      })

      .catch((error) => {

        console.log(error, "catch the hoop")

      })

对反应状态执行操作不是一个好习惯

Answer 2

你为什么要推动员工[1]？那将是第二个记录。