Javascript 使用setState动态填充对象数组

我的道具中有一个API中的对象数组，但我需要修改该对象数组中的元素，然后将其传递给应用程序中的播放器。我可以成功地获得我的对象数组，但当我尝试修改元素并将数据设置为状态时，新状态最终只包含列表中的最后一项。这是我的密码

        if(musicitem.musics){
            if(musicitem.musics.length === 0){
                this.setState({musicLimited:true })
            }
            else{
                return musicitem.musics.map((item, index)=>{
                    this.setState({
                        musics:[
                            ...musics,
                            {
                                url:apiConstants.API_MUSIC_FILES+item.url,
                                cover:apiConstants.API_MUSIC_FILES+item.cover,
                                artist:item.artist,

                            }
                        ]
                    })
                });
            }
        }

---

我希望我的音乐状态有一系列新构建的对象，但事实并非如此。它只会以我的对象数组中的最后一个对象结束。这意味着，它实际上已经循环了props中的对象数组，但是下一个状态一直覆盖前一个状态

在使用spread运算符时，您应该提到前一个状态的属性（即音乐），以使setState知道这一点

您可以通过将第一个参数传递给

this.setState（）

来访问以前的状态

例如：

this.setState（prevState=>（{music:[…prevState.music，{artist:item.artist}]}））

您的代码应按如下方式更新：

 if(musicitem.musics){
        if(musicitem.musics.length === 0){
            this.setState({musicLimited:true })
        }
        else{
            return musicitem.musics.map((item, index)=>{
                this.setState(prevState => ({
                    musics:[
                        ...prevState.musics, // use prevState
                        {
                            url:apiConstants.API_MUSIC_FILES+item.url,
                            cover:apiConstants.API_MUSIC_FILES+item.cover,
                            artist:item.artist,

                        }
                    ]
                }))
            });
        }
    }

---

非常感谢。它像魔法一样工作。1） 我以为…音乐，会做的，除此之外，我试图通过当前状态和前一状态，但我没有得到它的工作。肯定是因为我没有添加音乐。很高兴提供帮助！是，在setState的prop键值对中，必须使用前一个状态的对象显式定义前一个状态的属性