在react中的列表内的列表中添加元素

Question

我的状态上有以下变量：

this.state = {

        playerList: {
            player: [
                {
                    playerAlias: [
                        {
                            name: null
                        }
                    ],
                    idPlayer: null,
                    playerName: null,
                    broadcastChannel: null,
                    clusterName: null
                }
            ]
        }

    }

我想在我的playerAlias列表中添加一个playerAlias，然后执行此方法：

insertAliasToList = () => {
    let insertedAlias = {
        name: this.state.newAlias
    }

    this.setState(prevState => ({
        ...prevState,
        playerList: {
            ...prevState.playerList,
            player: {
                ...prevState.playerList.player,


                playerAlias: [...prevState.playerList.player.playerAlias, insertedAlias]


            }
        }
    }))

}

但是，发生此错误： Uncaught TypeError：传播非可迭代实例的无效尝试

谢谢。

Answer 1

这是因为您正在为数组使用对象语法。在这一行：

playerAlias: [...prevState.playerList.player.playerAlias, insertedAlias]

prevState.playerList.player是一个数组，因此不能在其上使用点符号。如果要向第一播放器添加新的播放器别名，则必须使用索引符号指定该别名：

playerAlias: [...prevState.playerList.player[0].playerAlias, insertedAlias]