vue3 孙组件调用爷组件方法

在Vue3中，孙组件要调用爷组件的方法，可以通过provide和inject来实现。首先，在爷组件中使用provide提供方法：

provide() {
  return {
    navTo: this.navTo
  }
},
methods: {
  navTo(index) {
    // 爷组件的方法逻辑
  }
}

然后，在孙组件中使用inject注入方法：

inject: ['navTo'],
methods: {
  callNavTo(index) {
    this.navTo(index);
  }
}

通过inject注入爷组件的navTo方法后，就可以在孙组件中调用该方法了。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* [vue学习（1）vue3/2下的 父子/爷孙组件间方法调用](https://blog.csdn.net/qq_39404437/article/details/122823331)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
- *2* *3* [vue组件 孙组件 调用爷组件（祖父组件）的方法](https://blog.csdn.net/qq_44224811/article/details/127846294)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 50%"]
[ .reference_list ]