provide 和 inject高阶使用

2020-01-12 14:56:31 阅读：244 来源： 互联网

标签：provide data zmsg inject 组件 foo 高阶

provide 在祖先里授权导出 inject在后代负责接收

foo可以是本组件的函数方法或者变量
foo 也可以是祖先组件自己祖先组件foo: this 后代组件 foo.$options.data().msg

祖先组件

<script>
export default {
  name: 'App',
  provide () {
    return {
      foo: this.zmsg
    }
  },
  data () {
    return {
      zmsg: '父元素'
    }
  }
}
</script>

后代组件

<template>
 <section>
    我是hello1
    {{foo.$options.data().zmsg}}
  </section>
</template>

<script>
  export default {
    name: "hello1",
    inject: ['foo'],
  }
</script>

标签：provide,data,zmsg,inject,组件,foo,高阶
来源： https://www.cnblogs.com/zhaofeis/p/12182654.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

provide 和 inject高阶使用