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 相关文章推荐
IE8 兼容性问题(属性名区分大小写)
Jun 04 Javascript
javascript 异常处理使用总结
Jun 21 Javascript
JQuery 前台切换网站的样式实现
Jun 22 Javascript
javascript 可以拖动的DIV(二)
Jun 26 Javascript
使用jQuery模板来展现json数据的代码
Oct 22 Javascript
juqery 学习之四 筛选查找
Nov 30 Javascript
node.js爬虫爬取拉勾网职位信息
Mar 14 Javascript
AngularJS前端页面操作之用户修改密码功能示例
Mar 27 Javascript
vue-cli如何添加less 以及sass
Jul 06 Javascript
Node.js中环境变量process.env的一些事详解
Oct 26 Javascript
react高阶组件添加和删除props
Apr 26 Javascript
JS实现TITLE悬停长久显示效果完整示例
Feb 11 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
Terran兵种介绍
2020/03/14 星际争霸
PHP中PDO事务处理操作示例
2018/05/02 PHP
ThinkPHP3.2框架操作Redis的方法分析
2019/05/05 PHP
jquery tab插件制作实现代码
2010/06/22 Javascript
利用js实现选项卡的特别效果的实例
2013/03/03 Javascript
node.js WEB开发中图片验证码的实现方法
2014/06/03 Javascript
在JavaScript中用getMinutes()方法返回指定的分时刻
2015/06/10 Javascript
jquery.gridrotator实现响应式图片展示画廊效果
2015/06/23 Javascript
jquery判断当前浏览器的实现代码
2015/11/07 Javascript
js 判断附件后缀的简单实现方法
2016/10/11 Javascript
详解ES6之用let声明变量以及let loop机制
2017/07/15 Javascript
浅谈Vue.js中ref ($refs)用法举例总结
2017/12/19 Javascript
vue2.0.js的多级联动选择器实现方法
2018/02/09 Javascript
jQuery实现新闻播报滚动及淡入淡出效果示例
2018/03/23 jQuery
解决vue this.$forceUpdate() 处理页面刷新问题(v-for循环值刷新等)
2018/07/26 Javascript
vue中使用better-scroll实现滑动效果及注意事项
2018/11/15 Javascript
基于Bootstrap和JQuery实现动态打开和关闭tab页的实例代码
2019/06/10 jQuery
Layui表格行工具事件与数据回填方法
2019/09/13 Javascript
使用zrender.js绘制体温单效果
2019/10/31 Javascript
微信小程序吸底区域适配iPhoneX的实现
2020/04/09 Javascript
JavaScript undefined及null区别实例解析
2020/07/21 Javascript
[02:04]2014DOTA2国际邀请赛 DK一个时代的落幕
2014/07/21 DOTA
Python字典操作简明总结
2015/04/13 Python
Python自动登录126邮箱的方法
2015/07/10 Python
Python 提取dict转换为xml/json/table并输出的实现代码
2016/08/28 Python
动态规划之矩阵连乘问题Python实现方法
2017/11/27 Python
Python判断文件和字符串编码类型的实例
2017/12/21 Python
浅析Python3爬虫登录模拟
2018/02/07 Python
对Python中创建进程的两种方式以及进程池详解
2019/01/14 Python
python操作文件的参数整理
2019/06/11 Python
Python实现冒泡排序算法的完整实例
2020/11/04 Python
APM Monaco中国官网:来自摩纳哥珠宝品牌
2017/12/27 全球购物
仓库规划计划书
2014/04/28 职场文书
中文专业求职信
2014/06/20 职场文书
黄石寨导游词
2015/02/05 职场文书
在NumPy中深拷贝和浅拷贝相关操作的定义和背后的原理
2022/04/14 Python