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 相关文章推荐
JS加ASP二级域名转向的代码
May 17 Javascript
javascript中的绑定与解绑函数应用示例
Jun 24 Javascript
Js与Jq获取浏览器和对象值的方法
Mar 18 Javascript
深入分析javascript中的错误处理机制
Jul 17 Javascript
JS实现根据文件字节数返回文件大小的方法
Aug 02 Javascript
jQuery 选择器(61种)整理总结
Sep 26 Javascript
Bootstrap按钮功能之查询按钮和重置按钮
Oct 26 Javascript
Bootstrap表单使用方法详解
Feb 17 Javascript
关于laydate.js加载laydate.css路径错误问题解决
Dec 27 Javascript
Vue+webpack+Element 兼容问题总结(小结)
Aug 16 Javascript
JS实现简单的点赞与踩功能示例
Dec 05 Javascript
vue简单封装axios插件和接口的统一管理操作示例
Feb 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
农民和部队如何穿矿
2020/03/04 星际争霸
怎样使用php与jquery设置和读取cookies
2013/08/08 PHP
国产PHP开发框架myqee新手快速入门教程
2014/07/14 PHP
php数组键名技巧小结
2015/02/17 PHP
浅谈php的优缺点
2015/07/14 PHP
如何解决PHP无法实现多线程的问题
2015/09/25 PHP
PhpStorm本地断点调试的方法步骤
2018/05/21 PHP
颜色选择器 Color Picker,IE,Firefox,Opera,Safar
2010/11/25 Javascript
javascript 基础篇4 window对象,DOM
2012/03/14 Javascript
使用focus方法让光标默认停留在INPUT框
2014/07/29 Javascript
node.js中的fs.close方法使用说明
2014/12/17 Javascript
JS实现带有3D立体感的银灰色竖排折叠菜单代码
2015/10/20 Javascript
AngularJS自定义指令实现面包屑功能完整实例
2017/05/17 Javascript
VUE利用vuex模拟实现新闻点赞功能实例
2017/06/28 Javascript
Three.js实现浏览器变动时进行自适应的方法
2017/09/26 Javascript
详解Vue.js项目API、Router配置拆分实践
2018/03/16 Javascript
node 文件上传接口的转发的实现
2019/09/23 Javascript
vue项目或网页上实现文字转换成语音播放功能
2020/06/09 Javascript
Python实现多线程抓取网页功能实例详解
2017/06/08 Python
python使用KNN算法手写体识别
2018/02/01 Python
tf.truncated_normal与tf.random_normal的详细用法
2018/03/05 Python
ubuntu 16.04下python版本切换的方法
2019/06/14 Python
Python自动化导出zabbix数据并发邮件脚本
2019/08/16 Python
浅谈pytorch卷积核大小的设置对全连接神经元的影响
2020/01/10 Python
利用keras加载训练好的.H5文件,并实现预测图片
2020/01/24 Python
python——全排列数的生成方式
2020/02/26 Python
Python同时处理多个异常的方法
2020/07/28 Python
python两种注释用法的示例
2020/10/09 Python
python 实现图片修复(可用于去水印)
2020/11/19 Python
黑猩猩商店:The Chimp Store
2020/02/12 全球购物
美国婴儿和儿童服装购物网站:PatPat
2020/10/01 全球购物
iHerb俄罗斯:维生素、补品和天然产品
2020/07/09 全球购物
说出数据连接池的工作机制是什么?
2013/04/19 面试题
银行类自荐信
2014/02/04 职场文书
党务公开方案
2014/05/06 职场文书
2014预备党员批评与自我批评思想汇报
2014/09/20 职场文书