1. 程式人生 > 程式設計 >小程式按鈕避免多次呼叫介面和點選方案實現(不用showLoading)

小程式按鈕避免多次呼叫介面和點選方案實現(不用showLoading)

本來是用showLoading的,點選直接轉菊花,但是呢,showLoading和 showToast這個方法是衝突的,你轉了菊花不能彈toast提示,在某個頁面需要提交一次表單和做輸入驗證,測試說可以點選多次

然後想到可以用一個變數判斷是否點選了,然後500毫秒後自動回來

寫在公共的utils方法裡面

// 防止多次點選
function btnClickedFun(self) {
  self.setData({
    btnClicked: true
  })
  setTimeout(() => {
    self.setData({
      btnClicked: false
    })
  })
}

js 程式碼

Page({
 data: {
  btnClicked: false
 },click: function (e) {
  utils.btnClickedFun(this);
  // 各種處理程式碼
  
  if (!form[json.departmentId]) {
    utils.showToast('請選擇所屬部門')
    return
  }
  ...
  // 各種處理程式碼
  
  utils.showLoading()
  
  開始調介面
  

 },})

html程式碼

<view bindtap="{{!buttonClicked?'click':''}}" data-id="{{id}}" />
<button bindtap="{{!buttonClicked?'click':''}}" data-id="{{id}}" />
<button bindtap="click" disabled="buttonClicked" data-id="{{id}}" />

到此這篇關於小程式按鈕避免多次呼叫介面和點選方案實現(不用showLoading)的文章就介紹到這了,更多相關小程式按鈕避免多次點選內容請搜尋我們以前的文章或繼續瀏覽下面的相關文章希望大家以後多多支援我們!