vue3中的provide 与 inject

一、概述

作用:实现祖先与后代组件的通信。一般为祖孙通信,因为子组件可以用props来通信。  

语法:父组件中:provide('car', car)    子组件中:let car = inject('car')

vue3中的provide 与 inject_第1张图片

二、举例说明(代码如下)

(1)目录结构 

vue3中的provide 与 inject_第2张图片

(2)parentView.vue(provide传递数据)





(3)childView.vue





(4)sunView.vue(inject接收数据)





三、最终效果展示

vue3中的provide 与 inject_第3张图片

你可能感兴趣的:(前端,javascript,vue3,祖孙通信,provide,inject)