微信小程序教程

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

我的站长站 2021-08-31 人阅读

方法一

直接在代码里控制,在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})
相关推荐
  • 微信小程序api
  • 微信小程序常用api大全

    1、小程序常用生命周期wx.getLaunchOptionsSync 获取小程序启动时的参数。与 App.onLaunch 的回调参数一致。wx.getEnterOptionsSync 获取本次小程序启动时的参数。如果当前是冷启动,则返回值与 App.onLaunch 的回调参数一致;如果当前是热启动,则返回值...

    微信小程序教程 9 5个月前
  • 微信小程序系统常用api大全

    1、wx.openAppAuthorizeSetting(Object object) wx.openAppAuthorizeSetting(Object object) 跳转系统微信授权管理页参数:1)success 接口调用成功的回调函数2)fail 接口调用失败的回调函数3)complete 接口调用结束的回调函数(调用成功、失败都会执行)2...

    微信小程序教程 12 5个月前
  • 微信小程序授权登录功能详解+示例代码

    授权登录开发思路1、调用wx.login() 微信api获取临时登录凭证code,并回传到开发者服务器2、调用auth.code2Session 微信api接口,获取用户唯一标识OpenID、 用户在微信开放平台帐号下的唯一标识UnionID和会话密钥session_key3、通过步骤2获取的参数进行...

    微信小程序教程 22 5个月前
最新更新