vue2 provide

作者：忽然之间发布日期:2025-08-12 浏览:52

// 父组件
export default {
  provide() {
    return {
      message: 'Hello from parent'
    }
  },
  data() {
    return {
      // 其他数据属性
    }
  },
  methods: {
    // 其他方法
  }
}

// 子组件
export default {
  inject: ['message'],
  created() {
    console.log(this.message) // 输出: Hello from parent
  }
}

解释说明：

provide 是 Vue 2 中的一个选项，用于定义父组件提供给子组件的数据或方法。
inject 是 Vue 2 中的一个选项，用于子组件注入父组件通过 provide 提供的数据或方法。
在上面的示例中，父组件通过 provide 提供了一个名为 message 的属性，值为 'Hello from parent'。
子组件通过 inject 注入了这个 message 属性，并在 created 生命周期钩子中输出了它的值。

上一篇：vue截取字符串的前4位

下一篇：vue scoped