不显示

showToast闪烁

做了一套公司的小程序,真机测试的时候发现一个问题 showToast闪烁一下 就消失了。然后我首先想到的是 是不是hide了。然后去复检代码,结果如下:

从头开始捋一下执行的顺序就不难理解了,代码顺序 wx.showLoading() =>wx.hideLoading() => wx.showToast() , 最后的运行顺序为wx.showLoading() => wx.showToast() =>wx.hideLoading() ,受到最后hide的影响,闪烁一下就没了。既然问题找到,解决就不难了

  • 思路 先执行hide 把showToast拿到最后去执行 *
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    wx.showLoading();
    wx.hideLoading();
    setTimeout( () => {
    wx.showToast({
    title: '提示语',
    icon: "none",
    });
    setTimeout( () =>{
    wx.hideToast();
    },2000)
    },0);

错误代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
// 请求事件
requestEvent: function() {

wx.showLoading({
title: '正在加载中',
})
wx.request({
url: '',
success: function(res) {
wx.showToast({
title: '成功',
duration: 2000
})
},
fail: function() {
wx.showToast({
title: '失败',
duration: 2000
})
},
complete: function() {
wx.hideLoading() //***** 问题出在这儿 调用 onComplete 时,hideLoading 将弹框隐藏掉了
}
})
}

正确代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
// 请求事件
requestEvent: function() {

wx.showLoading({
title: '正在加载中',
})
wx.request({
url: '',
success: function(res) {
wx.hideLoading()
wx.showToast({
title: '成功',
duration: 2000
})
},
fail: function() {
wx.hideLoading()
wx.showToast({
title: '失败',
duration: 2000
})
}
})
}

-------------本文结束感谢您的阅读-------------
坚持原创技术分享,您的支持将鼓励我继续创作!