子组件修改父组件的值的时候报错
Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop’s value.
按官方文档中的设计讲，父子组件中的数据流是单向的， 同时也给出了子组件操作数据时的解决方法.
-
方案1：
组件.png
不过，当props是对象的时候，子组件直接修改数据，不会引起警告。但还是不建议这样做……
- 方案2：父组件传值时使用.sync修饰，然后子组件中使用 $emit(‘update:xxx’) 改变。前提是vue版本>= 2.3.0，这种方式并没有改变单向数据流的特性。代码
// 父组件
....
<new-task :visible.sync="isTaskShow"></new-task>
....
// 子组件
....
methods: {
onClose() {
this.$emit('update:visible', false)
}
}
...
网友评论