首页 > 其他分享 >子组件向父组件传递信息的三种方式

子组件向父组件传递信息的三种方式

时间:2022-08-19 11:23:10浏览次数:59  
标签:函数 自定义 向父 传递信息 传递数据 事件 组件 回调

通过自定义组件事件,可以实现子组件向父组件传递信息(通信),这个事件的触发一定是以原声标签事件为基础的,也就是先触发子组件里的事件,接着在回调函数中爆发自定义事件。

 

1.通过父组件给子组件传递函数类型的props实现:子给父传递数据

先在子组件中定义prop,这里的prop当作是事件而非普通属性,应用该组件给事件定义回调函数,该回调函数会在组件中调用,并传参,参数就是子组件要给父组件传递的信息。其中这个prop指向在父组件中定义的函数。

  1. 通过父组件给子组件绑定一个自定义事件实现:子给父传递数据(第一种写法,使用@或v-on)

通过this.$emit(自定义事件名,参数),来自定义该组件的事件,该方法后面的参数就是要给父组件传递的信息。使用该事件时,回调函数必须设置参数,用来接收来自子组件的信息。

  1. 通过父组件给子组件绑定一个自定义事件实现:子给父传递数据(第二种写法,使用ref)

这种方法类似于 dom.on(事件名,回调函数),给某个组件绑定自定义事件(前提是该组件有这个事件),触发后执行回调函数(一般是在子组件中的某个事件回调函数中触发)。

标签:函数,自定义,向父,传递信息,传递数据,事件,组件,回调
From: https://www.cnblogs.com/lbz-wer/p/16601394.html

相关文章