vue加载自定义的js文件方法

下面小编就为大家分享一篇vue加载自定义的js文件方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧

在做项目中需要自定义弹出框。就自己写了一个。

效果图

遇见的问题

怎么加载自定义的js文件

vue-插件这必须要看。然后就是自己写了。

export default{ install(Vue){ var tpl; // 弹出框 Vue.prototype.showAlter = (title,msg) =>{ var alterTpl = Vue.extend({ // 1、创建构造器，定义好提示信息的模板 template: '<div>' + '<div>' + '<div>'+ title +'</div>' + '<div>'+ msg +'</div>' + '<div v-on:click="hideAlter">确定</div>' + '</div></div>' }); tpl = new alterTpl().$mount().$el; // 2、创建实例，挂载到文档以后的地方 document.body.appendChild(tpl); } Vue.mixin({ methods: { hideAlter: function () { document.body.removeChild(tpl); } } }) } }

使用

import jFAltre from '../../assets/jfAletr.js'; import Vue from 'vue'; Vue.use(jFAltre);

this.showAlter('提示','服务器请求失败');

以上这篇vue加载自定义的js文件方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章: