Question

我有一个组件状态下的数组，我想用来自API调用的一些数据来填充。问题在于，它显然总是被设置为“未定义”，因此我无法对其执行任何功能/无法在DOM中显示数据。

这是我现在的代码：

          return Container(
            margin: EdgeInsets.only(right:rightCut, left: leftCut),
              padding:
                  EdgeInsets.only(left: (_fullList[index].level * 30.0)),
              child: Card(
                  child: ListTile(
                ...

但是尝试显示数据时出现此错误：“ TypeError：无法读取未定义的属性'map'”。我究竟做错了什么？

编辑：我更改为this.state.documents.map，但现在仍然没有任何提示，也没有任何错误。我想念什么？

编辑＃2：通过在render（）中编写以下代码来解决该问题：

class DocumentsPage extends Component {

    constructor(props) {
        super(props);
        this.state = { documents: [] };
    }

    componentDidMount() {
        this.getDocuments();
    }

    getDocuments = (e) => {
        fetch('api/GetDocuments').then(documents =>
            documents.json()).then(data => {
                this.setState({
                    documents: data
                });
            })
    }

    render() {
        return (
            <div>
                {this.state.documents.map(document => <div> {document} </div>)}
            </div>
            )
    }
}

Answer 1

像这样写渲染

render() {
    return (
        <div>
            {this.state.documents && this.state.documents.map(document => <div> {document} </div>)}
        </div>
        )
}

数组在组件状态下未定义（反应）

1 个答案: