[vue] 解决父子组件传值 prop，子组件改变值后父组件的值也会随之改变

props 的类型为基本数据类型时，子组件不能改变父组件的值
props 的类型为引用数据类型时，子组件是可以改变父组件的值的

为什么呢？

基本数据类型存储在栈中
引用数据类型存储在堆中
props 的传递是将数据浅拷贝下来，拷贝的引用数据类型其实指向对一个对象，拷贝在栈中，内容还是指向同一个堆地址，而基本数据类型本身就是在栈中，就会全部拷贝下来

当在子组件中改变基本数据类型时，父组件中的值不会改变，但是当改变引用类型数据时，因为父组件和子组件中的 props 保存的引用类型数据的地址时一样的，对应地址的值也一起改变

解决：

使用JSON.parse(JSON.stringify(data)) 处理数据

参考：

vue——解决父子组件传值，子组件改变值后父组件的值也会随之改变