子组件修改从父组件传过来的值同时响应更新
我们都知道子组件直接修改父组件传过来的值的话控制台会报错,一般的做法是通过$emit(‘自定义属性名’,value)来实现修改
这里我们使用另外一种方法:
例如:
我们需要当点击某项操作后刷新表格,需要改变表格loading的状态,
直接修改控制台肯定是会报错的
这个时候我们就需要在父组件中在自定义属性名后加上.sync修饰符
父组件
<children :loading.sync="loading"></children>
然后在子组件中加上update属性就可以实现父组件和子组件同时响应变化
子组件
this.$emit('update:loading',true)
this.$api...
.then(res => {
this.$emit('update:loading',false) /成功调用接口后关闭loading
})
这样就修改成功了,同时控制台也不会报错,父组件和子组件也是同时更新的