《vue3引入js方法》
解决方案
在Vue3项目中引入js方法，可以采用多种方式。一种是直接将js文件中的方法导入到Vue组件中使用；另一种是在全局进行配置，使js方法可以在整个Vue应用中方便调用。这能够有效地组织代码结构，复用功能逻辑，满足不同场景下的需求。
局部引入js方法
当js方法只在某个特定的Vue组件中使用时，可以选择局部引入。假设我们有一个名为utils.js的文件，其中定义了一个简单的计算两个数之和的方法。
javascript
// utils.js
export function add(num1, num2) {
return num1 + num2;
}
然后在Vue组件中这样引入并使用：
```javascript
import { ref } from 'vue'
import { add } from './utils.js'
export default {
setup() {
const result = ref(add(2, 3))
return {
result
}
}
}
```
全局引入js方法
如果希望js方法在整个Vue应用中都能被调用，可以将其挂载到Vue的原型上（对于Vue3来说是通过创建一个插件或者利用provide / inject的方式）。以下是创建插件的方式。
```javascript
// myPlugin.js
import { add } from './utils.js'
export default {
install(app) {
app.config.globalProperties.$add = add
}
}
然后在`main.js`中使用这个插件：
import { createApp } from 'vue'
import App from './App.vue'
import MyPlugin from './myPlugin.js'
const app = createApp(App)
app.use(MyPlugin)
app.mount('#app')
``
在组件中就可以直接通过
还有一种思路是利用Vuex进行状态管理的同时也可以封装一些通用的方法，在store中定义actions或getters等，各个组件通过mapActions或者mapGetters等辅助函数引入这些方法，这也是一种间接引入js方法的方式，适用于有复杂业务逻辑且需要共享数据和方法的情况。
