解决vue3+vant开发中loading效果的问题

如果在updataSureClick方法中直接使用loadingTwo的话,会一直出现loading的效果,因为const定义的loadingTwo是有一个常量,在setup加载的过程中,会按照单线程以此加载,会直接就加载到loadingTwo,所以updataSureClick调用的loadingTwo就不起作用,但是如果把loading效果加在一个函数里,函数的执行是在被调用之后才执行的,所以这个时候才会执行loadingOne的方法。

  
    // loading效果    
    function loadingOne() {
      Toast.loading({
        duration: 0, // 持续展示 toast
        forbidClick: true,
        message: "加载中...",
      });
    }
    const loadingTwo: any = Toast.loading({
      duration: 0, // 持续展示 toast
      forbidClick: true,
      message: "加载中...",
    });
    //在updataSureClick方法中调用loading效果,
  const updataSureClick = async (b: any) => {
      button_click.updata_click = b;
      button_click.updata_sure_click = b;
      try {
        let param: any;

        const info = await Sync(param);

        loading();
        tagesdata();
        console.log("bbbbbinfo: ", info);
      } catch (e) {
        console.log(e);
      } finally {
      //运用finally是不管接口调用的成功与否,loading效果都被清除
        Toast.clear();
      }
    };
    
Logo

前往低代码交流专区

更多推荐