vue的provide inject使用方法

144 阅读1分钟

在父组件上写,与data同级


export default {
  data() {
    return {
      total: 10000,
      name: "Child",
    };
  },
  provide: {
    foo: {
      a: 1,
      b: 2,
    },
  },
  }

在子组件写

export default {
  data() {
    return {
      totla: 100,
    };
  },
  inject: ["foo"],
};

当然,普通的父子组件还是this.$parent 和ref 简单使用点