uniapp 之 解决uni.showToast、uni.showLoading、uni.hideLoading之间的冲突问题

  在我们使用uniapp时,通常会在调取接口的时候经常会使用到uni.showToast、uni.showLoading、uni.hideLoading这三个api,先简单查阅一下这三个api的作用官方文档;
  
  

问题阐述:

  在调取接口时,我们通常会在调取接口前给用户一个正在加载的一个提示框,也就是uni.showLoading,当接口可以访问成功时隐藏加载提示框(uni.hideLoading),然后根据访问成功后端返回的状态(success、error)来判断数据是否成功,当状态为success时需要给用户提示获取成功,反之提示获取失败,这时使用的就是消息提示框(uni.showToast);然而在调取接口时通常我们看到的是加载提示框在访问成功后隐藏了,但是我们后面设置的消息提示框 uni.showToast 却没有出现。
  
  
  
  
解决方案:

  不知道大家有没有注意消息提示框其实是可以设置显示状态的,就是icon设置项
  
在这里插入图片描述
  
接着我们再利用提示的延迟时间duration这个设置项来设置消息提示框的显示时间;
在这里插入图片描述
  
最后再利用一个api关闭消息提示框
在这里插入图片描述
  
显示加载提示框(此处利用的消息提示框实现的加载提示框)

// 显示加载提示框(此处利用的消息提示框实现的加载提示框)
uni.showToast({
	title: '加载中……',
	icon: 'loading',
	duration: 30000 // 当然这个时间可根据实用场景进行相关设置
})

  
随后在接口访问成功时关闭加载提示框

// 随后在接口访问成功时关闭加载提示框
uni.hideToast()

  
最后你就可以根据后端返回状态再去进行相对应的消息提示框了,并且可以正常的显示出来了。

  • 1
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

zhuangvi

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值