vue实现provide inject 响应式传值

46 阅读1分钟

直接贴代码

父组件
provide () {
    return {
      parentProjectId: this.getProjectId
    }
  }
  
methods: {
   // 方法取值
    getProjectId () {
      return this.projectId
    }
}
子孙组件获取值
// 接收
inject: ['parentProjectId'],
computed: {
    projectId () {
      return this.parentProjectId()
    }
},
// 监听变化
watch: {
    projectId: {
      // 执行方法
      handler () {
        // 响应式
      },
      immediate: true
    }
}