时间戳

首页 > 解决方案 > 在组件内部运行的自定义过滤器和/或插件

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

问题描述

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

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

一个例子是大写文本{{ postTitle | uppercase }}，另一个被称为 insidecomputed或methodsasuppercase(String)

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

非常感谢任何帮助者。

标签： filterpluginsvuepresscomposable

解决方案

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

你可以在每个组件中添加你的辅助函数作为 mixins，或者在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
            }
        }
    })
}

这个问题有一个很好的例子，在单个文件组件而不是全局范围中定义 mixin。您可以在Vue.js 文档中找到有关 mixins 的更多信息。

另一种方法是将您的辅助函数分离到 vuepress 插件中。

推荐阅读