微信小程序form表单重复提交
来自维基鲸
wxml
<view class="modal-buttons"> <view class="one_btn" bindtap="submit">确认</view> <view class="two_btn" bindtap="cancel">取消</view> </view>
wxss
/* 按钮 */ .modal-buttons { width: 100%; height:7%; display: flex; font-weight:bold; } .one_btn{ flex:1; display: flex; align-items: center; justify-content: center; background-color: #4b97e7; border-top: 1rpx solid #4b97e7; color: #fff; border-radius: 0; } .two_btn{ flex:1; display: flex; align-items: center; justify-content: center; width: 100%; border-top: 1rpx solid #4b97e7; border-radius: 0px; background-color: #fff; color: #4b97e7; }
js
const app = getApp() Page({ data: { submitting:false//设置按钮禁用参数,默认为非禁用状态 }, //确认 submit(){ var that = this; if (that.data.submitting) { return; // 如果正在提交中,则直接返回,避免重复提交 } // 禁用提交按钮 that.setData({ submitting: true, }); console.log('执行下面的方法') wx.request({ url: app.globalData.position + 'Produce/test', data: { wip_id: options.id }, header: { "Content-Type": "application/x-www-form-urlencoded" }, method: 'POST', dataType: 'json', success: res => { //请求完成,取消禁用 that.setData({ submitting: false, //取消禁用 }); }, fail(res) { //请求完成,取消禁用 that.setData({ submitting: false, //取消禁用 }); console.log("查询失败") } }) } })