vue子组件向父组件传值的三种方式

一、通过父组件给子组件传递函数类型的props实现

父组件:


子组件:



props: ['getChildInfo']

sendChildInfo() {
	this.getChildInfo(数据);
}

二、通过父组件给子组件绑定自定义事件实现

第一种方式:

父组件:


子组件:



send() {
	this.$emit('haha');
}

第二种方式:

父组件:



mounted() {
	this.$refs.xxx.$on('haha', this.test);
}

子组件:



send() {
	this.$emit('haha');
}
注意:
  1. 若想让自定义事件只能触发一次,可以使用once修饰符,或者$once方法。

  2. 组件上也可以绑定原生DOM事件,需要使用native修饰符

    
    
  3. 通过this.$refs.xxx.$on('haha', 回调)绑定自定义事件时,回调要么配置在methods中,要么用箭头函数,否则this的指向会出问题。

你可能感兴趣的:(vue)