vue金典copy问题：
父组件传值给子组件时，子组件直接使用，会直接污染原数据；
父组件:
原数据 data:[{id:1},{id:2},{id:3}];
当data传入子组件使用时直接使用data，循环渲染时会直接影响原数据
子组件：
需要使用数据 this.list = this.data；
子组件使用list渲染，父组件对应的值会跟着list变化而变化，渲染id：1时，返回继续渲染id：2时发现原数据变成id:1,原数据污染；
这里说明vue组件传值根本问题没有避免
父组件传值原则：父组件跟子组件值避免直接使用，父组件传值必须使用一个不常使用的值，推荐传值时在进行赋值操作，且该值并不在父组件进行渲染或使用；
子组件传值原则：传值同上；
子组件接收值时注意：组件接收值时应做好最后一道防线，传过来的数据有使用应深度copy传过来的值并附给自己需要使用的值，在进行自己内部使用；
解决！
copy：
实例数据：this.a = {id:1}；
浅度copy同等于我们普通赋值；例如：this.b = this.a;
深度copy：① this.b = JSON.parse(JSON.stringify(this.a));
② this.b = {...this.a};
区别：第一种方法使用js原生方法进行copy，在个个版本的js中均可使用；原理:对一个数据进行两次转换，当转换第一次时原数据类型发生改变， 自动生成一个新的数据，在对新生成的数据进行二次转换成我们需要的数据，实现深度copy； == Object转String在转Object；
第二种方法使用ES6解构赋值进行深度copy，原理：...把数据全部展开并且一一对上；详情请查看ES6解构赋值：https://www.runoob.com/w3cnote/deconstruction-assignment.html
前端小白继续加油
