Vuejs2 如何在vuejs.vue模板中为导入的模块使用帮助函数？

我有一个helper.js文件，其中包含：

module.exports = {
    getSrmColor: (color) => {
        return color;
    }
}

我的.vue文件包含：

<template>
    <div>
    {{ recipeHelper.getSrmColor(recipe.color) }}
    </div>
</template>
<script>
    import recipeHelper from "./helpers.js";
    export default {
        name: "Recipe",
        props: ["recipe"]
    }
</script>

---

我认为您需要为您的导入值创建“数据值”。你能试试这样的吗

<script>
 import recipeHelper from "./helpers.js";
 export default {
     name: "Recipe",
     props: ["recipe"],
     data: function() {return {
          recipeHelper: recipeHelper
     }}
 }
</script>

从“/helpers.js”导入recipeHelper；
导出默认值{
名称：“配方”，
道具：[“配方”]，
数据：函数（）{return{
recipeHelper：recipeHelper
}}
}

在vue组件中创建新的帮助器实例，如下所示

从“/helpers.js”导入recipeHelper；
导出默认值{
名称：“配方”，
道具：[
“食谱”
],
挂载：函数（）{
this.recipeHelper=recipeHelper；
}
}

<script>
 import recipeHelper from "./helpers.js";
 export default {
     name: "Recipe",
     props: ["recipe"],
     data: function() {return {
          recipeHelper: recipeHelper
     }}
 }
</script>