vue2.0 解決抽取公用js的問題

更新時間：2020年07月31日 11:39:00 作者：曉果博客

這篇文章主要介紹了vue2.0 解決抽取公用js的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧

首先創(chuàng)建公用js

在static中創(chuàng)建js—>utils.js

utils.js內(nèi)容如下：

export default {
 install(Vue, options) {
  Vue.prototype.formatDuring = function (mss) {
   var days = parseInt(mss / (1000 * 60 * 60 * 24));
   var hours = parseInt((mss % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
   var minutes = parseInt((mss % (1000 * 60 * 60)) / (1000 * 60));
   var seconds = (mss % (1000 * 60)) / 1000;
   return days + " 天 " + hours + " 小時 " + minutes + " 分 " + Math.round(seconds) + " 秒 ";
  }
 }

}

在main.js中引入，以便全局使用

// 引入公用js
import utils from '../static/js/utils.js' 
Vue.use(utils);

在需要的地方使用

endline = this.formatDuring(currentTime);

ok！

補(bǔ)充知識：VUE 創(chuàng)建共通js 以及引用該js的共通方法

一個方法被多個js函數(shù)多次調(diào)用，為了減少代碼量以及方便后期維護(hù)，創(chuàng)建一個公用的js類。

commonUtil 共通類

// 共通類
let commonUtil = {
};
 
commonUtil.openLogin = function (terminal) {
  console.log("i am is js mathod;" + terminal);
};
 
export default commonUtil;

其他js調(diào)用

首先引入該類

import commonUtil from "../../../src/utils/commonUtil";

其次調(diào)用共通類里面的openLogin方法

commonUtil.openLogin("Hello VUE");

運(yùn)行結(jié)果：

以上這篇vue2.0 解決抽取公用js的問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

vue+bpmn.js實(shí)現(xiàn)自定義流程圖的完整代碼
這篇文章主要介紹了vue+bpmn.js實(shí)現(xiàn)自定義流程圖的完整代碼,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借價值,需要的朋友參考下吧
2024-03-03
vue3自定義動態(tài)不同UI組件篩選框案例
動態(tài)組件是一種在Vue中根據(jù)條件或用戶輸入來動態(tài)渲染不同組件,本文主要介紹了vue3自定義動態(tài)不同UI組件篩選框案例,具有一定的參考價值,感興趣的可以了解一下
2025-04-04
vuex新手進(jìn)階篇之a(chǎn)ctions的使用方法
actions用來處理mutations中的異步操作,觸發(fā)mutations中的函數(shù),下面這篇文章主要給大家介紹了關(guān)于vuex新手進(jìn)階篇之a(chǎn)ctions的使用方法,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2022-10-10
vue中v-for數(shù)據(jù)狀態(tài)值變了,但是視圖沒改變的解決方案
這篇文章主要介紹了vue中v-for數(shù)據(jù)狀態(tài)值變了，但是視圖沒改變的解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
2022-06-06
vue?+?ele?實(shí)現(xiàn)下拉選擇框和下拉多選選擇框處理方案
這篇文章主要介紹了vue?+?ele?實(shí)現(xiàn)下拉選擇框和下拉多選選擇框處理方案,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下
2023-08-08
Vue仿Bibibili首頁的問題
這篇文章主要介紹了Vue仿Bibibili首頁,本文給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下
2021-01-01
Vue組件設(shè)計-滾動置頂設(shè)計案例
這篇文章主要介紹了Vue組件設(shè)計-滾動置頂設(shè)計案例,本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下
2023-04-04
vscode jsconfig.json 使用簡介
通過jsconfig.json文件定義一個JavaScript項目,目錄中是否存在此類文件表示該目錄是JavaScript項目的根目錄,文件本身可以選擇列出屬于項目的文件,要從項目中排除的文件以及編譯器選項,這篇文章主要介紹了vscode jsconfig.json 使用說明,需要的朋友可以參考下
2023-09-09
Vue如何獲取兩個時間點(diǎn)之間的所有間隔時間
這篇文章主要介紹了Vue如何獲取兩個時間點(diǎn)之間的所有間隔時間，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
2022-07-07
vue百度地圖通過地址名稱獲取地址的經(jīng)緯度gps問題(具體步驟)
在Vue項目中，可以通過使用百度地圖JavaScript?API來實(shí)現(xiàn)根據(jù)地址名稱獲取經(jīng)緯度GPS的功能，本文分步驟給大家詳細(xì)講解vue百度地圖獲取經(jīng)緯度的實(shí)例，感興趣的朋友一起看看吧
2023-05-05