首先创建一个loading.js
import { Loading } from 'element-ui';
// Loading 中的配置项
const loadingOptions = {
text: '努力加载中...'
}
let loadingInstance;
class LoadingEvent {
show() {
loadingInstance = Loading.service(loadingOptions)
}
hidden() {
loadingInstance.close()
}
}
export default new LoadingEvent()
在main.js 中引用
import loading from '@/utils/loading'
...
// Vue.prototype.$loading 这样定义无效，应该是element 定义的loading覆盖了
Vue.prototype.$loads = loading
...
在.vue文件中使用
login() {
// 显示loading
this.$loads.show()
setTimeout(() => {
// 关闭loading
this.$loads.hidden()
}, 2000);
}
网友评论