前言

provide和inject是Vue3来实现父组件与子组件间通信
套路：父组件有一个provide选项来提供数据，子组件有一个inject选项来开始使用这些数据

provide和inject的使用

父组件：

export default {
  components: { Child },
  setup() {
    let car = reactive({ name: "123", price: "456" });
    provide("car", car);
    return {
      ...toRefs(car),
    };
  },

子组件：

  setup() {
    let car = inject("car");
    return {
      car,
    };
  },

provide和inject的注意事项

（1）provide和inject需要在setup()方法中且不能在内嵌的生命周期中使用，否则会报错

因此inject在获取父组件provide传递的数据时，需要同步获取