在组件内部运行的自定义过滤器和/或插件

问题描述

我们已经构建了一个大型 Vuejs 应用程序，我们现在将其组件添加到 Vuepress。

然而，我们在弄清楚如何转移一些全局使用的插件和整个项目中使用的可组合函数时遇到了问题。它们是用于格式化日期、货币和大小写的典型辅助插件。

一个例子是大写文本 {{ postTitle | uppercase }}，另一个将在 computed 或 methods 中调用为 uppercase(String)

我找不到关于 Vuepress 的任何关于如何创建和管理辅助函数的文档。

非常感谢任何帮助者。

解决方法

有一些选项可以将功能全局应用于您的 vuepress 项目。

您可以在每个组件中添加辅助函数作为 mixin，或在 enhanceApp.js 文件中全局定义它们。例如，在下面的代码中，我全局定义了 helperFunction() 方法

// enhanceApp.js
export default ({
    Vue,// the version of Vue being used in the VuePress app
    options,// the options for the root Vue instance
    router,// the router instance for the app
    siteData,// site metadata
    isServer // is this enhancement applied in server-rendering or client
}) => {
    Vue.mixin({
        methods: {
            helperFunction () {
                // Your helper function
            }
        }
    })
}

This question 有一个在单个文件组件而不是全局范围内定义 mixin 的好例子。您可以在 Vue.js documentation 中找到有关 mixin 的更多信息。

另一种方法是分离你的辅助函数 into vuepress plugins。