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。尝试如下操作：

这2种语法是等效的

// 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);
      })
  }

如何在React中的状态下获取数组的长度？

1 个答案: