在main.js中

import { Toast } from 'vant';

Vue.use(Toast);

// 将所有 Toast 的展示时长设置为 2000 毫秒

Toast.setDefaultOptions({ duration: 2000 });

Vue.prototype.$showLoading = Toast.bind(Toast, {//bind 改变this指向,指向Toast

type: "loading",//类型加载中

message: "Loading...",//自定义文本

forbidClick: true,//禁止点击

loadingType: "spinner",//菊花圈

duration: 0,//值为 0 时,toast 不会消失

});

Vue.prototype.$hideLoading = Toast.clear.bind(Toast);//关闭提示

这样MAIN.JS配置就OK了,接下来在vue文件中的script中直接使用

如:methods:{

 downloadPage() {

      this.$showLoading();//加载中

      console.log(this.lang);

      return getSoftwareList({ lang: this.lang })

      .then((res) => {

        console.log(res.data);

        this.downLoadList = res.data;

        this.$nextTick(() => {

          if (this.downLoadList.length > 0) {

            this.isShow = true;

          } else {

            this.isShow = false;

          }

        });

      })

      .finally(() => {

          this.$hideLoading();//结束加载

        });

    },

}

Logo

前往低代码交流专区

更多推荐