React - 在组件状态下向数组内部的对象添加属性

Question

我正在获取状态中的对象数组，并且尝试为每个对象添加一个属性。
问题是我可以看到我的属性被添加到每个对象中，但是当我映射所有这些对象并尝试console.log它时，我得到了undefined

添加属性

addFavourites() {
        let data = this.state.data.map((e) => {
            e.favourite = false;
            return e;
        });
        return data;
    }

state = {
        data: []
    }

addFavourites 在这里被调用：

getItem = () => {
        this.service
            .mergeData()
            .then((body) => {
                this.setState({
                    data: body
                },
                () => {
                    this.addFavourites();
                },
                () => {
                    this.dataToFilter();
                });
            });
    }

    componentDidMount(){
        this.getItem();
    }

在渲染功能中，我可以看到所有对象，包括最喜欢的对象

console.log(data.map((e) => e));

但这给出了一个未定义的数组

console.log(data.map((e) => e.favourite));

我该如何解决这个问题？

Answer 1

首先，欢迎光临！你应该更清楚地表明这个问题是关于 React 的。

现在回答一下，每个状态修改都将使用 进行setState，因此您的addFavourites函数应该如下所示：

addFavourites() {
    let data = this.state.data.map((e) => {
        e.favourite = false;
        return e;
    });
    this.setState({ data: data });
}