setState不触发更新-reactJs

我正在使用socket.io并做出反应。我在componentDidMount（）中设置了侦听器，但setState（）函数不会触发更新。当我记录

数据时

，我可以看到从服务器发送的数据。这是我的密码：

this.state = {
    list: []
};

public componentDidMount() {
    this.socket = io('https://mybackendurl.com');
    this.socket.on('an-event', data => {
      console.log(data);
      const list = [...this.state.list];

      const updatedItemIndex = list.findIndex(
        d => d.id === data.id
      ) as number;
      list[updatedItemIndex].approvedBy = data.approvedBy;
      this.setState({ list });
    });
}

---

有人能告诉我是什么问题以及如何解决这个问题吗？

ComponentDidMount

在加载组件后触发一次。您需要使用

componentDidUpdate（）

你应该检查一下

---

而且

我不能完全肯定地说这会导致react看不到状态差异，但从技术上讲，您是在变异状态，这可能会导致react将旧的变异状态视为与新的更新状态匹配，并选择不重新渲染。 您可以使用

const list=[…this.state.list]

创建一个新的列表数组，该数组很好，但是您更新的嵌套对象仍然是以前的引用。同时尝试创建一个新的嵌套对象

this.socket.on（'an-event'，data=>{
const list=[…this.state.list.map（item=>（{…item}）]；//创建新对象
const updatedItemIndex=list.findIndex(
d=>d.id==data.id
)作为数字；
列表[updatedItemIndex].approvedBy=data.approvedBy；
this.setState（{list}）；
});

尝试删除公共关键字我建议将您的

socket.on

函数放在一个单独的文件中，这不是绝对必要的，但我是这样做的。然后我将调用

socket.emit

在componentDidMount和setState中，并返回结果。如果您在调用

setState

之前立即登录控制台，您会这样做吗看到你更新的数组了吗？@Brianthonpson是的，我可以看到我更新的数组。我可以看到我的状态也更新了。但是DOM没有更新updated@KhanhLuu，您是使用PureComponent还是应该使用ComponentUpdate或UseMoom？来处理正在更改的数据？