javascript - React中如何获取某个状态下数组的长度？

Question

我有一个带有 API 调用的 React 应用程序。我使用初始数组设置状态，并在 API 调用中将其设置为 JSON 数组。我需要获取数组长度进行计算。我尝试了以下代码，但没有成功!控制台只显示“未定义”

componentDidMount() {
    API.get('project')
      .then(({ data }) => {
        this.setState({ 
          columns: data.response,
          ordered: Object.keys(data.response)
        }, () =>
          console.log("old ", this.state.columns.length)
        )
      })
      .catch((err) => {
        console.log("AXIOS ERROR: ", err);
      })
  }

Answer 1

好吧，您正在从 XHR 解构 response 对象并直接获取 data 字段，然后再次调用 .response它。这相当于编写 responseFromXHR.data.response。尝试如下操作:

这两种语法是等效的

// old syntax
axios.get('/user/12345')
  .then(function (response) {
    console.log(response.data);
  })

VS

// destructuring syntax
axios.get('/user/12345')
  .then(function ({data}) {
    console.log(data);
  })

我不知道你的API到底检索了什么，但这样的东西似乎更好:

componentDidMount() {
    API.get('project')
      .then(({ data }) => {
        // debugger; // uncomment to display debugger in chrome and check `data` value
        this.setState({ 
          columns: data,
          ordered: Object.keys(data)
        }, () =>
          console.log("old ", this.state.columns.length)
        )
      })
      .catch((err) => {
        console.log("AXIOS ERROR: ", err);
      })
  }