vue中注册自定义的全局js方法
前端开发的时候,总会需要写一些js方法,在vue框架中为了方便使用,可以考虑注册一个全局的js方法,下面是注册步骤:
1.0可以在assets文件中的js文件下面新建一个js文件,如:yun.js---
2.0在yun.js上面实现日期格式方法,如下
importVuefrom'vue' constformat=(o,format)=>{//日期类型 letargs={ "M+":o.getMonth()+1, "d+":o.getDate(), "h+":o.getHours(), "m+":o.getMinutes(), "s+":o.getSeconds(), "q+":Math.floor((o.getMonth()+3)/3),//quarter "S":o.getMilliseconds() }; if(/(y+)/.test(format))format=format.replace(RegExp.$1,(o.getFullYear()+"").substr(4-RegExp.$1.length)); for(letiinargs){ letn=args[i]; if(newRegExp("("+i+")").test(format))format=format.replace(RegExp.$1,RegExp.$1.length==1?n:("00"+n).substr((""+n).length)); } returnformat; } exportdefaultfunction(Vue){ //添加全局API Vue.prototype.$yuns={ format } }
3.0下面将yun.js文件注册到vue的全局中去,需要在main.js文件下面注册全局:如图下
4.0前面步骤将自定义的js注册到全局去了,后面就可以使用了,如下:
已上就是在vue中注册全局的自定义js文件的步骤,以后需要添加js方法,就在yun.js加上去就可以调用了
补充:Vue自定义函数挂到全局方法
方法一:使用Vue.prototype
//在mian.js中写入函数 Vue.prototype.getToken=function(){ ... } //在所有组件里可调用函数 this.getToken();
方法二:使用exports.install+Vue.prototype
//写好自己需要的fun.js文件 exports.install=function(Vue,options){ Vue.prototype.getToken=function(){ ... }; }; //main.js引入并使用 importfunfrom'./fun' Vue.use(fun); //在所有组件里可调用函数 this.getToken();
在用了exports.install方法时,运行报错exportsisnotdefined
解决方法:
exportdefault{ install(Vue){ Vue.prototype.getToken={ ... } } }
方法三:使用全局变量模块文件
Global.vue文件:
在需要的地方引用进全局变量模块文件,然后通过文件里面的变量名字获取全局变量参数值。
总结
以上所述是小编给大家介绍的vue中注册自定义的全局js方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对毛票票网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!
声明:本文内容来源于网络,版权归原作者所有,内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:czq8825#qq.com(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立刻删除涉嫌侵权内容。