Vue 解决Element 编辑表格数据时，表单数据同时发生变化

具体案例，如标题所示，在我们平常处理编辑表单时，需要将数据从表格中读取，然后赋值到表单中，但是由于错误的操作，可能会出现不必要的麻烦，就如同标题一样。那要如何解决这个问题。也很简单。

我们需要了解，深拷贝和浅拷贝的区别。
我简短的讲，就是浅拷贝直接把地址赋值给object对象。而深拷贝则是把全部的值赋值给object对象。
这两种的区别就是，浅拷贝：object对象改变也会改变source对象，同时改变，就会出现如标题的情况。深拷贝：讲值赋值给object对象，这样修改object对象时，source对象就不会改变。也就完美的解决了上面标题出现的情况。

第一种方法

this.form = JSON.parse(JSON.stringify(data));

第二种方法

deepCopy(obj) {
        if (obj === null || typeof obj !== 'object') {
            return obj;
        }

        const copy = Array.isArray(obj) ? [] : {};

        for (const key of Object.keys(obj)) {
            if (obj.hasOwnProperty(key)) {
                // 特殊处理日期对象
                if (obj[key] instanceof Date) {
                    copy[key] = new Date(obj[key]);
                } else {
                    // 递归处理数组元素或对象属性
                    copy[key] = this.deepCopy(obj[key]);
                }
            }
        }

        return copy;
    }