如何为 Vue JS 创建自定义函数，例如created()钩子？

Question

我应该如何创建一个插件，将名为struct的函数（如created()挂钩）添加到所有组件？此外，我希望我的插件能够访问结构返回值。exportdefault{structure(){//Accesstocontext}}我不得不提一下我使用InertiaJS。

P粉848442185 · Answer

您可以使用 Vue Mixins 或可组合项。

两者都可以为您提供一些共享的函数和变量。但我不知道如何在 Vue 中定义新的钩子，比如 create() 。我必须自己在created() 中启动你的函数。当然，您可以使用 Mixins 覆盖现有的 Vue hooks。

Mixin 非常方便，但不再推荐

Composition API 中没有 created() ，所以你必须使用onBeforeMount()或onMounted()

这是一个使用这两种技术的非常基本的示例

const { createApp, ref, onBeforeMount } = Vue;

const myMixin = {
  created() {
    console.log('myMixin: created()')
  }
}

const myComposable = () => {
    onBeforeMount(() => {
       console.log('myComposable: onBeforeMount()')    
    })
    const myFunction = () => console.log('myFunction()')    
    return { myFunction }
}

const App = {
  setup() {
    const { myFunction } = myComposable()
    return  { myFunction }
  },
  mixins: [myMixin]
}

const app = createApp(App)
app.mount('#app')