vue2.0 解决抽取公用js的问题


Posted in Javascript onJuly 31, 2020

首先创建公用js

在static中创建js—>utils.js

vue2.0 解决抽取公用js的问题

utils.js内容如下:

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!

补充知识:VUE 创建共通js 以及引用该js的共通方法

一个方法被多个js函数多次调用,为了减少代码量以及方便后期维护,创建一个公用的js类。

commonUtil 共通类

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

其他js调用

首先引入该类

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

其次调用共通类里面的openLogin方法

commonUtil.openLogin("Hello VUE");

运行结果:

vue2.0 解决抽取公用js的问题

以上这篇vue2.0 解决抽取公用js的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript之文件操作
Mar 07 Javascript
javascript或asp实现的判断身份证号码是否正确两种验证方法
Nov 26 Javascript
THREE.JS入门教程(1)THREE.JS使用前了解
Jan 24 Javascript
Javascript事件实例详解
Nov 06 Javascript
jquery checkbox 勾选的bug问题解决方案与分析
Nov 13 Javascript
javascript引擎长时间独占线程造成卡顿的解决方案
Dec 03 Javascript
jQuery修改class属性和CSS样式整理
Jan 30 Javascript
JS键盘版计算器的制作方法
Dec 03 Javascript
深入理解Angularjs向指令传递数据双向绑定机制
Dec 31 Javascript
Bootstrap进度条学习使用
Feb 09 Javascript
node中的密码安全(加密)
Sep 17 Javascript
Vue2 添加数据可视化支持的方法步骤
Jan 02 Javascript
vue实现公共方法抽离
Jul 31 #Javascript
js实现无缝轮播图插件封装
Jul 31 #Javascript
原生js滑动轮播封装
Jul 31 #Javascript
Vue+ElementUI 中级联选择器Bug问题的解决
Jul 31 #Javascript
jquery轮播图插件使用方法详解
Jul 31 #jQuery
在Uni中使用Vue的EventBus总线机制操作
Jul 31 #Javascript
jQuery带控制按钮轮播图插件
Jul 31 #jQuery
You might like
基于php常用函数总结(数组,字符串,时间,文件操作)
2013/06/27 PHP
php基于数组函数实现关联表的编辑操作示例
2017/07/04 PHP
微信公众平台开发教程①获取用户Openid及个人信息图文详解
2019/04/10 PHP
Code: write(s,d) 输出连续字符串
2007/08/19 Javascript
ExtJs 3.1 XmlTreeLoader Example Error
2010/02/09 Javascript
如何设置一定时间内只能发送一次请求
2014/02/28 Javascript
jquery序列化表单去除指定元素示例代码
2014/04/10 Javascript
JavaScript eval() 函数介绍及应用示例
2014/07/29 Javascript
创建js对象和js类的方法汇总
2014/12/24 Javascript
jQuery页面刷新(局部、全部)问题分析
2016/01/09 Javascript
JavaScript登录验证码的实现
2016/10/27 Javascript
JavaScript中return用法示例
2016/11/29 Javascript
jQuery Validate 数组 全部验证问题
2017/01/12 Javascript
Javascript Event(事件)的传播与冒泡
2017/01/23 Javascript
Webpack打包慢问题的完美解决方法
2017/03/16 Javascript
NodeJS有难度的面试题(能答对几个)
2019/10/09 NodeJs
vue 解决form表单提交但不跳转页面的问题
2019/10/30 Javascript
Python语言的12个基础知识点小结
2014/07/10 Python
linux 下实现python多版本安装实践
2014/11/18 Python
Django卸载之后重新安装的方法
2017/03/15 Python
python 类详解及简单实例
2017/03/24 Python
python3 判断列表是一个空列表的方法
2018/05/04 Python
Python实现的矩阵转置与矩阵相乘运算示例
2019/03/26 Python
在python中用url_for构造URL的方法
2019/07/25 Python
Python3.6+selenium2.53.6自动化测试_读取excel文件的方法
2019/09/06 Python
Django实现CAS+OAuth2的方法示例
2019/10/30 Python
Django values()和value_list()的使用
2020/03/31 Python
Python爬虫开发与项目实战
2020/12/16 Python
印度最大的酒店品牌网络:OYO Rooms
2016/07/24 全球购物
北美Newegg打造的全球尖货海购平台:tt海购
2018/09/28 全球购物
高中毕业自我鉴定
2013/12/19 职场文书
物流专业大学的自我评价
2014/01/11 职场文书
中班幼儿评语大全
2014/04/30 职场文书
学生上课迟到检讨书
2015/01/01 职场文书
用JS实现飞机大战小游戏
2021/06/09 Javascript
python实现简易自习室座位预约系统
2021/06/30 Python