- 作用:实现祖与后代组件间通信
- 套路:父组件有一个
provide
选项来提供数据,后代组件有一个inject
选项来开始使用这些数据
具体写法(需要引入):
祖组件中
import { provide } from "vue"; setup(){ ...... let car = reactive({name:'奔驰',price:'40万'}) provide('car',car) ...... }
后代组件中:
import { inject } from "vue"; setup(props,context){ ...... const car = inject('car') return {car} ...... }
这些使用了父组件中的数据都是响应式的
一般子组件还是使用props传递
参考链接:
https://www.bilibili.com/video/BV1Zy4y1K7SH?p=162&spm_id_from=pageDriver