为了账号安全,请及时绑定邮箱和手机立即绑定

Vue 子组件的 updated 事件触发后,为什么父组件的 updated 事件不触发呢?

Vue 子组件的 updated 事件触发后,为什么父组件的 updated 事件不触发呢?

白猪掌柜的 2019-05-12 15:30:22
假设现在子组件只是一个按钮,按钮点击后会改变子组件的data数据。为什么这样子操作只会触发子组件的updated而不会触发父组件的updated呢?有没有什么方法是不修改子组件的情况下,在父组件捕获子组件的这种更新呢?Vue.component("abc",{name:"abc",template:`{{hi.a}}`,data(){return{hi:{a:"1"}}},methods:{add(){this.hi.a=this.hi.a+"1";}},updated(){console.log("com-updated");}});newVue({el:'#app',updated(){console.log("updated");}})
查看完整描述

2 回答

?
哆啦的时光机

TA贡献1779条经验 获得超6个赞

父组件要监听子组件的事件发生可以使用emit和on进行,子组件必须要触发事件,然后父组件才可以接收到。子组件:
{{hi.a}}
methods:{
add(){
this.$emit('changeHi',this.hi.a)//触发changeHi这个自定义方法,'this.hi.a'为向父组件传递的数据
}
}
父组件
//监听子组件触发的changeHi事件,然后调用changeHi方法
methods:{
changeHi(a){//a为子组件传过来的数据
a=a+"1";
}
}
当然,还可以使用vuex进行数据传输,但使用vuex一般是中大型项目,小型项目的话就自定义事件进行父子组件传输,兄弟组件的数据传输的话可以使用eventbus或者是vue-event-proxy这个插件
                            
查看完整回答
反对 回复 2019-05-12
?
UYOU

TA贡献1878条经验 获得超4个赞

你改变子组件的数据是不会触发父组件的钩子的。Vue中的通信是单向的,父组件可以通过props来向子组件传递信息,也就是说子组件可以知道父组件的状态变化,而子组件的状态变化父组件是不知道的。如果你想让子组件向父组件发送信息,可以通过on和emit来指定和触发自定义事件来进行通信,或者也可以用vuex来实现这个功能。
                            
查看完整回答
反对 回复 2019-05-12
  • 2 回答
  • 0 关注
  • 2572 浏览
慕课专栏
更多

添加回答

了解更多

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信