ReactJS:TypeError:无法添加/删除密封的数组元素

Question

我正在尝试使用API​​制作Apollo GraphQL并react在使用subscriptions-transport-ws库的GraphQL订阅的帮助下更新组件实时.对于删除操作,我收到TypeError: Cannot add/remove sealed array elements错误.这是来自试图从订阅更新数据的react组件的代码.

   componentWillReceiveProps(nextProps) {
        if (!this.subscription && !nextProps.data.loading) {
                let { subscribeToMore } = this.props.data
                this.subscription = [subscribeToMore(
                {
                    document: postDeleted,
                    updateQuery: (previousResult, { subscriptionData }) => {
                     const delPost = subscriptionData.data.postDeleted;
                     const mainData = previousResult.Posts;               

                     let post = mainData.find(post => post.id == delPost.id);
                     let updatedList =  mainData.splice(post, 1);
                     return updatedList;
                    },
                }
                )]
       }
    }

Answer 1

mainData很可能是" 密封 "的,因此您的splice操作会抛出错误:

let updatedList =  mainData.splice(post, 1);

解决方案是制作数组的副本(在这里使用数组解构):

let updatedList = [...mainData].splice(post, 1);

你可以在Chrome控制台中试试这个:

a = [1, 2, 3];
Object.seal(a);
a.splice(1)

// Uncaught TypeError: Cannot add/remove sealed array elements
//  at Array.splice (<anonymous>)
//  at <anonymous>:1:3

[...a].splice(1)

// [2, 3]