Layui adds a loading effect before implementing the request, and closes it after the request is successful

1. Use layerthe component to add a loading loadingeffect before the request, and close it after the request is successful.

$("#switch").click(function() {
   layer.confirm('确认切换至英文环境?', function(index) {
      var loadingIndex = layer.load(1, {
         shade: [0.1,'#fff'] //0.1透明度的白色背景
      });

      $.ajax({
         url: '<%=rootPath%>/login/langSwitch',
         type: 'post',
         dataType: 'json',
         data: {
            language: 'en'
         },
         success: function (data) {
            if (data.code == 10000) {
               layer.closeAll("loading");
               layer.msg(tips(data.code));
            }
         },
         error: function (data){
            layer.closeAll("loading");
         }
      })

      layer.close(index);
   });
   return false;
});

In the above code, we use layer.load()the method to create an loadingeffect and store its return value loadingIndexin . Then, before sending the request, we display this loadingand assign its return value to loadingIndex, which is used to close when the request succeeds or fails loading. When the request is successful, we use layer.closeAll("loading")to close all on the page loading. The same applies when the request fails. Finally, we close the dialog after it pops up.

Among them, layer.msg()the method can be used to pop up a message prompt box on the page. The specific content can be adjusted as needed.