vue开发过程中，父组件通过props传值给子组件，子组件在页面展示父组件的值，在操作子组件值以后，即使不点击确定按钮，父组件中的值也发生了变化，但是需求是操作子组件数据以后，必须点击”确定”按钮以后才能修改父组件的值，否则父组件和子组件的值都不可以变化。
为了解决这一问题，当父组件传值给子组件以后，我通过JSON.parse(JSON.stringify(data ))将父组件的数据进行拷贝，然后赋值给子组件中this.targetdData,子组件操作也是改变的this.targetData的值，而不会改变父组件的值，当点击”确定”按钮时，通过$emit调用父组件中的函数，将修改后的this.targetData值给了父组件，修改父组件中的值，当再次进入子组件的时候，会重新把修改后的值拷贝给子组件进行展示就可以解决上述问题了。
拷贝父组件的值：
this.targetData = JSON.parse(JSON.stringify(this.targetDataPar))调用父组件方法：
this.$emit('changeData', this.targetData)父组件的方法：
changeData(val) {
this.targetChanged = val;
},版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 举报，一经查实，本站将立刻删除。
文章由极客之音整理，本文链接：https://www.bmabk.com/index.php/post/188441.html
![[Vue2]AntDesignVue基于Select封装「多选 + 二级级联+ 可自定义添加item 组件」](https://www.bmabk.com/wp-content/uploads/2022/05/post-loading-480x300.gif)
