如何在 VueJS 组件中使用通用脚本

Posted 2023-02-23

【中文标题】如何在 VueJS 组件中使用通用脚本

【英文标题】：How using common script in components with VueJS

【发布时间】：2020-04-22 10:06:34

【问题描述】：

当我尝试使用 javascript 文件中的方法时，我有一个组件（见下文）。但不起作用，正确的做法是什么？

<template>
  <div id="test"></div>
</template>

<script>
import myShared from '../shared.js'

export default 
  methods: 
    postPost() 
      myShared.displayMessage();
     
  

</script>

我希望 displayMessage 方法可以在此脚本的每个组件中使用：

export default   
  methods: 
     displayMessage: function () 
        console.log('Test')
     
  

谢谢，

【问题讨论】：

你可以查看 mixins 的文档：vuejs.org/v2/guide/mixins.html

这适用于 Vue CLI 吗？没有什么特别的想法吗？

是的，没什么特别的。如果你把 mixin 写在一个单独的文件中，你只需要将它导入到你想使用的地方。

使用Vuex

您是否尝试过在 main.js 中导入？

【参考方案1】：

您可以使用 mixins（但它可能会在 vue.js 3 中被弃用） 您可以创建任何helper.js 来导出函数。