解决vue多次提交

 

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<template>
 <button @click="submit()" :disabled="isDisable">点击</button>
</template>
<script>
 export default {
  name: 'TestButton',
  data: function () {
   return {
    isDisable: false
   }
  },
  methods: {
   submit() {
    this.isDisable = true
    setTimeout(() => {
     this.isDisable = false
    }, 1000)
   }
  },
 }
</script>

这里我们通过控制isDisable 来设置 disabled来控制按钮的点击和不可点击。 默认isDisable:的值为 false，按钮可以点击。 当我们点击这个按钮的时候，首先将按钮的绑定isDisable设置为true，1秒后立马将其置为false。

所以用户必须1秒后才能再次点击，那个时候，模态框已经关闭了。可以设置为1500合适

posted @ 2019-11-26 10:40  brady-wang  阅读(673)  评论(0)  编辑  收藏  举报