如何使用this.setState更新数组中对象的一个​​属性的值？

编程问答 2022-08-15

问题描述

当我执行图像上传时，尝试更改数组中一个对象的值。

图像来自具有标识名称的子组件，然后遍历数组（存储在状态中）并尝试替换相应对象的图像道具。还尝试了forEach。

我已经在this answer和this answer上尝试了所有解决方案，但可惜没有找到答案。

这是我最近的两次尝试：

handleImageUpload = (data) => {

// method 1
    for (let i = 0; i <= this.state.artists.length; i++) {
      console.log(data);
      if (this.state.artists[i].artist === data.artist) {
        let artists = [...this.state.artists];
        let newArtistEdit = {
          name: data.name,image: data.image,};
        artists[i] = newArtistEdit;
        this.setState({ artists });
      } else return;
    }


// method 2,using immutability helper
    for (let i = 0; i <= this.state.artists.length; i += 1) {
      try {
        if (this.state.artists[i].artist === data.artist) {
          this.setState((prevState) => ({
            artists: update(this.state.artists,{
              i: { image: { $set: data.image } },}),}));
        }
      } catch (error) {
        console.log(error.message);
      }
    }

};

有什么想法可以使艺术家[i]的图像道具永远不会更新？

作为参考：方法1不会更新任何内容，方法2添加了一个名为'null'的新状态属性，其中包含图像。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

javascriptmultidimensional-arrayreactjsreactjsstate