Question

在内容满意的cms上使用数组索引时无法获取数据

constructor() {
    super();
    this.state = {
        partners: [],
    }
}

client = contentful.createClient({
    space: process.env.REACT_APP_CONTENTFUL_SPACE_ID,
    accessToken: process.env.REACT_APP_CONTENTFUL_ACCESS_TOKEN
})

componentDidMount() {
    this.client.getEntries({
        'content_type': 'partnersCollection',
        'order': 'sys.createdAt',
    })
        .then(response => {
            this.setState({
                partners: response.items
            })
        })
        .catch(console.error);
}

render(){
    console.log("SIDE BAR RESULT: ", this.state.partners)
    console.log(this.state.partners[0])
    return null;
}

Console.log("SIDE BAR RESULT: ", this.state.partners)将显示有条件的cms的所有结果。与数组索引示例this.state.partners[0].fields一起使用时，会出现

错误

无法读取未定义的属性“字段”

有人知道为什么使用数组索引会导致错误消息吗？

Answer 1

在初始状态-this.state.partners为空数组，因此找到this.state.partners[0].fields会出错

您需要检查渲染

    if(this.state.partners.length > 0) {
         this.state.partners[0].fields
    }

承诺一旦解决，它将在state.partners中设置componentDidMount()，render()将会更新。

使用内容丰富的cms定义数组索引时无法显示数据

1 个答案: