loading加载中效果两种实现方法

方法一

直接在代码里控制，在wxml文件里布局弹窗loading层，利用条件渲染，在JS代码里控制是否显示loading层。

文档地址：https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-react.html?t=20161107#wxshowtoastobject

js代码

showLoading:function(){
       wx.showToast({         title: '加载中',         icon: 'loading'
       });
    },cancelLoading:function(){
       wx.hideToast();
    }

方法二

在wxml文件里布局弹窗，利用条件渲染，在js代码里控制是否显示

文档地址:https://mp.weixin.qq.com/debug/wxadoc/dev/framework/view/wxml/list.html?t=20161107

wxml代码

<view >
   <loading wx:if="{{showLoading}}">加载中</loading>
</view>

js

data: {      showLoading:true},showLoading:function(){     this.setData({        showLoading:true
    })
 },cancelLoading:function(){    this.setData({        showLoading:false})

　　本文转载自:精准像素：11px.cn ，感谢作者分享实用知识