2021-07-21

最新推荐文章于 2024-03-04 09:42:14 发布

jierchadeshen

最新推荐文章于 2024-03-04 09:42:14 发布

阅读量431

点赞数

CC 4.0 BY-SA版权

文章标签： react es6 reactjs

本文链接：https://blog.csdn.net/jierchadeshen/article/details/118961618

本文探讨了在React的useEffect Hook中处理对象数组时遇到的`Uncaught TypeError: Cannot delete property '1' of [object Array]`错误。通过分析问题，我们发现错误源于直接操作数组。解决方案是使用展开运算符创建数组副本，然后进行修改，避免直接修改原始数据。这种方法确保了数据的安全性和组件的正确渲染。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

项目场景：useEffect里面用外面的数据报错：Uncaught TypeError: Cannot delete property ‘1’ of [object Array]

问题描述：数据类型为对象数组


interface IProps {
  data: any[];
}

const TableList: React.FC<IProps> = ({ data }) => {
  useEffect(() => {
    if (data && data.length > 1) {
      let dataArray = data;
      let totalObj = dataArray.pop();
      console.log(totalObj);
      console.log(dataArray);
    }
  }, [data]);

在这里插入图片描述

解决方案：

interface IProps {
  data: any[];
}
const TableList: React.FC<IProps> = ({ data }) => {
  useEffect(() => {
    if (data && data.length > 1) {
      let dataArray = [...data];// 用展开运算符，再赋值
      let totalObj = dataArray.pop();
      console.log(totalObj);
      console.log(dataArray);
    }
  }, [data]);