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 相关文章推荐
jquery创建div 实现代码
Apr 27 Javascript
jQuery 拖动层(在可视区域范围内)
May 24 Javascript
javascript window.confirm确认 取消对话框实现代码小结
Oct 21 Javascript
在Javascript中 声明时用"var"与不用"var"的区别
Apr 15 Javascript
JS 页面计时器示例代码
Oct 28 Javascript
js 显示base64编码的二进制流网页图片
Apr 04 Javascript
jquery实现倒计时效果
Dec 14 Javascript
js注入 黑客之路必备!
Sep 14 Javascript
JS获取子节点、父节点和兄弟节点的方法实例总结
Jul 06 Javascript
基于vue-upload-component封装一个图片上传组件的示例
Oct 16 Javascript
Element DateTimePicker日期时间选择器的使用示例
Jul 27 Javascript
简单了解JavaScript作用域
Jul 31 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自动适应范围的分页代码
2008/08/05 PHP
PHP+MYSQL实现用户的增删改查
2015/03/24 PHP
php生成图片缩略图的方法
2015/04/07 PHP
PHP实现单文件、多个单文件、多文件上传函数的封装示例
2019/09/02 PHP
[JS源码]超长文章自动分页(客户端版)
2007/01/09 Javascript
json 入门基础教程 推荐
2009/10/31 Javascript
extjs 为某个事件设置拦截器
2010/01/15 Javascript
防止jQuery ajax Load使用缓存的方法小结
2014/02/22 Javascript
jQuery 获取兄弟元素的几种不错方法
2014/05/23 Javascript
Grunt入门教程(自动任务运行器)
2015/08/06 Javascript
asp.net中oracle 存储过程(图文)
2015/08/12 Javascript
jQuery实现的简单折叠菜单(折叠面板)效果代码
2015/09/16 Javascript
基于javascript实现全国省市二级联动下拉选择菜单
2016/01/28 Javascript
EasyUi中的Combogrid 实现分页和动态搜索远程数据
2016/04/01 Javascript
早该知道的7个JavaScript技巧
2016/06/21 Javascript
全面解析node 表单的图片上传
2016/11/21 Javascript
bootstrap模态框实现拖拽效果
2016/12/14 Javascript
JavaScript中set与get方法用法示例
2018/08/15 Javascript
对vue v-if v-else-if v-else 的简单使用详解
2018/09/29 Javascript
Vue.js 中的 v-model 指令及绑定表单元素的方法
2018/12/03 Javascript
JavaScript中ES6规范中let和const的用法和区别
2020/08/06 Javascript
前端性能优化建议
2020/09/17 Javascript
用python结合jieba和wordcloud实现词云效果
2017/09/05 Python
python字符串的方法与操作大全
2018/01/30 Python
tensorflow实现KNN识别MNIST
2018/03/12 Python
python得到单词模式的示例
2018/10/15 Python
python实现AES加密和解密
2019/03/27 Python
详解python 爬取12306验证码
2019/05/10 Python
Win10 安装PyCharm2019.1.1(图文教程)
2019/09/29 Python
Python tkinter布局与按钮间距设置方式
2020/03/04 Python
pycharm 激活码及使用方式的详细教程
2020/05/12 Python
职业教育毕业生求职信
2013/11/09 职场文书
关于工作经历的证明书
2014/10/11 职场文书
不尊敬老师的检讨书
2014/12/21 职场文书
长江七号观后感
2015/06/11 职场文书
mysql如何配置白名单访问
2021/06/30 MySQL