vue组件通信之‘provide+inject’的用法

vue组件通信之‘provide+inject’的用法

父组件

• provide：获取的的是父组件里面所有的属性，与inject搭配使用

// 与inject搭配使用
provide() {
    
    
    return {
    
    
      parent: this
    }
  }

子组件

• inject：获取从provide传来的所有的属性, 并注入本页面

inject: ['parent'], // 接收provide提供的数据

注意：:provide并不是响应式的，当子组件inject的时候已经丢失了响应式功能。可通过$emit、props等方式进行响应式通信。如果你传入了一个可监听的对象，那么其对象的属性还是可响应的,对象是因为是引用类型。