vue.js+iview 实现全局加载的公用方法

main.js 为入口js文件，在main.js 文件加入如下的代码（引入iview的 Spin 组件，暴露全局公用方法）：

iview的 Spin组件的地址：www.iviewui.com/components/…

import { Spin  } from iview;
Vue.prototype.$Spin = Spin;
/**
 * @TODO 加载loading的方法，在页面直接调用 this.showSpinLoading(message);
 * @param message 加载提示的文字
 */
Vue.prototype.showSpinLoading = function (message){
	this.$Spin.show({
		render: (h) => {
			return h('div', [
				h('Icon', {
					'class': 'demo-spin-icon-load',
					props: {
						type: 'ios-loop-strong',
						size: 50
					}
				}),
				h('div', {
					style: {
						fontSize: '20px',
					},
				},message)
			])
		}
	});
}
/**
 * @TODO 隐藏loading的方法，在页面直接调用 this.hideSpinLoading();
 */
Vue.prototype.hideSpinLoading = function (){
	this.$Spin.hide();
}
复制代码

上一篇：docker安装18.03.0+rancher1.6.17 的容器虚拟化部署，欢迎留言评论学习