Vue如何引用public中的js文件
更新時間：2022年09月22日 08:35:08 作者：asdfsdgfsdgfa
這篇文章主要介紹了Vue如何引用public中的js文件，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
如何引用public中的js文件
在public文件夾下創(chuàng)建config.js文件。
config.js中可以使用變量，也可以使用window來掛載
測試：
注意：index.html在引入config.js時，config.js前面一定要加上/ ，否則子路由菜單刷新會報錯，提示找不到j(luò)s文件
vue引用公共js
在.vue文件中，需要調(diào)用一些工具方法，所以需要將公共方法放在公共js中，供組件調(diào)用。
步驟
1.創(chuàng)建公共js
創(chuàng)建utils.js
src/common/utils.js
export default {
? ? show:function () {
? ? ? console.log("公共方法");
? ? }
}2.在main.js引入公共js
// 引用公共js import utils from './common/utils.js' Vue.prototype.utils = utils
3.調(diào)用公共方法
export default {
? name: 'abc',
? data () {
? ? return {
? ? }
? },
? methods:{
? ? click:function () {
? ? ? this.utils.show();
? ? }
? }
}控制臺輸出：
abc
總結(jié)：將公共方法放在同一個js中，方便調(diào)用和維護，避免重復(fù)代碼
以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
解決vue3.0運行項目warning Insert `·` prettier/pret
這篇文章主要介紹了解決vue3.0運行項目warning Insert `·` prettier/prettier問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2023-10-10
vue3.0?router路由跳轉(zhuǎn)傳參問題(router.push)
這篇文章主要介紹了vue3.0?router路由跳轉(zhuǎn)傳參問題(router.push)，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-02-02
這篇文章主要介紹了Vue.js slot插槽的作用域插槽用法詳解,本篇文章通過簡要的案例,講解了該項技術(shù)的了解與使用,以下就是詳細內(nèi)容,需要的朋友可以參考下2021-09-09
vue 路由傳參的使用場景一般都是應(yīng)用在父路由跳轉(zhuǎn)到子路由時,攜帶參數(shù)跳轉(zhuǎn),傳參方式可劃分為 params 傳參和 query 傳參,本文將給大家介紹如何通過不同方式在 Vue 3 中傳遞路由參數(shù),需要的朋友可以參考下2024-07-07
Vue cli3 庫模式搭建組件庫并發(fā)布到 npm的流程
這篇文章主要介紹了Vue cli3 庫模式搭建組件庫并發(fā)布到 npm，以下一個簡單的顏色選擇器插件 vColorPicker 講述從開發(fā)到上線到npm的流程,需要的朋友可以參考下2018-10-10
這篇文章主要為大家詳細介紹了Vue實現(xiàn)6位數(shù)密碼，優(yōu)化iOS WebView卡頓，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-08-08
這篇文章主要介紹了Vue 實現(xiàn)樹形視圖數(shù)據(jù)功能,利用簡單的樹形視圖實現(xiàn)的，在實現(xiàn)過程中熟悉了組件的遞歸使用，感興趣的朋友跟隨腳本之家小編一起學(xué)習(xí)吧2018-05-05
Vant?Weapp組件picker選擇器初始默認(rèn)選中問題
這篇文章主要介紹了Vant?Weapp組件picker選擇器初始默認(rèn)選中問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-01-01
詳解vue 中使用 AJAX獲取數(shù)據(jù)的方法
本篇文章主要介紹了詳解vue 中使用 AJAX獲取數(shù)據(jù)的方法，在VUE開發(fā)時，數(shù)據(jù)可以使用jquery和vue-resource來獲取數(shù)據(jù)，有興趣的可以了解一下。2017-01-01
這篇文章主要介紹了vue?雙向綁定問題$emit無效的解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2022-09-09