解決vue 按鈕多次點選重複提交問題
阿新 • • 發佈:2018-11-22
做專案時通常會遇到點選2次或多次表單按鈕會重複提交資料,解決這個問題,需要將提交按鈕置灰。可以通過disabled控制按鈕的點選和不可點選,下面舉個例子
<Button type="primary" @click="bookok" :disabled="isDisable">確定</Button> <script> export default { return { isDisable: false,//表單重複提交 }, methods: { bookok() { this.isDisable = true //開始可以點選 this.post("api/student/Bespeak/getBespeak", { 'stuId':this.rowData.stuId, 'bespeakId':this.rowData.bespeakId, 'courseId':this.courseId }).then(data => { this.isDisable = false;//執行請求後就不能點選了 if (data.code == 0) { this.isShow = true this.$Message.success("預約成功"); this.btnSearch() } else { this.$Message.error(data.msg); } }); }, } } </script>