vue2跨组件传值、透明传输($attrs 和 $listeners )

当在 Vue.js 组件中使用 $attrs 和 $listeners 时,它们提供了一种方便的方式来处理传递给组件的属性和事件监听器。

1.$attrs 是一个对象,包含了父组件传递给当前组件但未被当前组件声明的 props。这对于实现“透明传输”非常有用。

2.$listeners 也是一个对象。它包含了父组件传递给当前组件的所有事件监听器。

示例:

  往下传值:$attrs

  爷组件:

vue2跨组件传值、透明传输($attrs 和 $listeners )_第1张图片

  父组件:

 vue2跨组件传值、透明传输($attrs 和 $listeners )_第2张图片

子组件  :
vue2跨组件传值、透明传输($attrs 和 $listeners )_第3张图片

往上传值:

爷组件:

vue2跨组件传值、透明传输($attrs 和 $listeners )_第4张图片

父组件: 

 vue2跨组件传值、透明传输($attrs 和 $listeners )_第5张图片

 

子组件:
 vue2跨组件传值、透明传输($attrs 和 $listeners )_第6张图片

你可能感兴趣的:(vue.js,前端,javascript)