一个关于 Provide 的问题

[wjkang]

怎么使用@Provide 实现与下面代码一样的功能

@Component({
  provide() {
    return {
      indexBar: this
    };
  }
})

试过这样写

@Provide() public indexBar = this;

然后

console.log(this.indexBar === this);

一直为 false

[hank-cp]

@Provide不能provide this. 换种写法吧, 子组件要@Inject什么就@Provide什么, 一整个丢出去意义何在

[lijing666]

@Provide不能provide this. 换种写法吧, 子组件要@Inject什么就@provide什么, 一整个丢出去意义何在

其实对于父子关系很明确的组件关系，比如表单和表单子项之间，把表单传给表单所有子组件是很直接的做法了，很多开源组件框架也都这么干的了，虽然把一个个要用的属性方法再写一遍provide出去可以，但是没有直接provide this来得简单直接，因为后续会发现要不停的补，除非有一天vue官方不给provide this了，其实provide this 就是this.$parent......的更简洁的方式了，纯属个人愚见，欢迎指正

[ColorfulMirror]

事实上，使用@Provide只能是提供一个值或者一个方法。 提供一个方法，使用function(),()=>{}, classMethod()。效果都不同，源于babel的编译原理。 要provide this只能使用提供方法。直接，间接提供this值都是不行的。 可以这样 父组件 @Provide() getIndexBarContext(){ return this; } 子组件 ` @Inject() getIndexBarContext!:any;

xx(){ const context = this.getIndexBarContext(); } ` 快乐编码~

[Chanceux-L]

getIndexBarContext(){ return this; }

这样的this不是指向子组件吗？

[Chanceux-L]

可以使用$parent、$children结合获取当前的this eg：@Provide() select = this.$parent.$children[0]