Question

我遇到了React的问题。我有一个数组，我传递给this.state。但是我遇到了一个问题，我无法访问数组中的子元素。就我而言，我无法访问this.state.folders [0]。

这是我的代码：

class DriveContent extends Component {
    constructor () {
        super();
        let list_files = [];
        let list_folders = [];
        axios.get('/api/getFilesAndFolders').then((response) => {
            for (var i = 0; i < response.data.length; i++) {
              if (response.data[i]["isFile"] ==true){
                  list_files.push(response.data[i]);
              }
              else {
                  list_folders.push(response.data[i]);
              }
            }
        }).catch((error) => {
             console.error(error);
        });

       this.state = {files: list_files, folders: list_folders};
       console.log(this.state.folders);
       console.log(this.state.folders[0]);
    }

以下是返回2 console.log：

的内容

// console.log(this.state.folders);
        []
    0: "Commun"
    1: "Privé"
    2: "Public"
    length: 3

//console.log(this.state.folders[0]);
    undefined

提前致谢！

Answer 1

您过早设置状态。在回调函数中，在分配给setState和list_files后需要list_folders，因为回调是在构造函数完成后执行的。试试这个：

for (var i = 0; i < response.data.length; i++) {
     if (response.data[i]["isFile"] ==true){
       list_files.push(response.data[i]);
     }
     else {
       list_folders.push(response.data[i]);
     }
}
// setState here:
this.setState = {files: list_files, folders: list_folders};

然后将console.logs移动到渲染功能以查看正在更新的状态。一旦进行初始构建，再次在setState之后。

反应this.state未定义的数组

1 个答案: