小程序同时设置点击跳转与自动跳转导致重复跳转的问题及解决
生活随笔
收集整理的這篇文章主要介紹了
小程序同时设置点击跳转与自动跳转导致重复跳转的问题及解决
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
小程序的自動跳轉頁面一般會有兩個功能,一個是點擊跳轉,另一個是三秒內未點擊則自動跳轉,同時添加兩個這兩個功能會導致點擊跳轉后,自動跳轉仍會執行,即會發生兩次跳轉。這種情況則需要“上🔒”,即,如果點擊跳轉則不需要進行自動跳轉。解決辦法:設置變量:isRedict: true,點擊事件使其值為false,在自動跳轉的定時器中,使用判斷語句,若isRedict為true,則進行自動跳轉。代碼如下
//點擊事件綁定的函數,跳轉order頁面goToOrder() {this.isRedict = false;wx.redirectTo({url: '/pages/order/order',})}, //3秒后自動跳轉onShow() {setTimeout(() => {if (this.isRedict) {wx.redirectTo({url: '/pages/order/order',})}}, 3000);},另外3秒后自動跳轉在頁面的展示,可以在onLoad() 函數中設置定時器去改變渲染的數值,代碼如下
//time為渲染頁面的數據,初始值為3 //count為用來計數的變量onLoad: function (options) {this.changeTime()},changeTime() {if (this.count < 0) {clearTimeout(timer)}const timer = setTimeout(() => {this.setData({time: this.count--})this.changeTime()}, 1000);},總結
以上是生活随笔為你收集整理的小程序同时设置点击跳转与自动跳转导致重复跳转的问题及解决的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: v-if 与v-show 的区别及使用场
- 下一篇: 前端面试分享:秋招总结(html和css