如何在vue-fullpage包装器中从子组件调用fullpagejs方法？

Question

我不明白如何从VUE子组件调用fullpagejs方法，更确切地说，是从任何不是顶级App.vue组件的组件中调用。

fullpage的vue包装器限制您只能在整个应用程序中使用fullpage组件一次，因此我不能在任何子组件中使用this.$refs.fullpage.api调用任何方法。

我希望有一些可以触发导航方法的可点击元素，比如嵌套在低级组件中的moveTo。

作者打算如何让vue应用程序使用App.vue之外的方法？

我所能找到的唯一可以正常工作的东西似乎相当粗糙；我使用子组件通过$root.children[0]从App.vue调用一个方法。

我应该以某种方式传递整个页面的ref作为道具吗？

我知道道具和事件，但要编写代码将事件冒泡到4-5层子组件上似乎非常乏味。

我尝试使用单独的vue实例创建事件总线，但该事件总线实例无法访问App.vue中的方法。

感觉我好像错过了什么。

fullpage是否只需要在App.vue中合并对fullpage api的所有方法调用

Answer 1

从文档中：

//where --> var vm = new Vue({...}) if calling it from outside.
vm.$refs.fullpage.build();

//or, when calling it from inside the Vue component methods:
this.$refs.fullpage.build();

您还可以使用窗口对象中的全局对象：fullpage_api。例如：fullpage_api.moveSectionDown()。

如果您知道如何改进您的用例，请随时创建一个pull请求，我将很乐意将其合并到组件中！:)