elementui里面的switch怎样避免多次点击频繁问题

项目中使用了switch按钮 当点击改变状态发一次请求 这样如果用户多次点击就频繁发请求了 怎么优化一下 类似于防抖 让他频繁点击只触发最后一次 怎样实现呀

img

基本上可以放弃v-model,改为value绑定

img

用setInterval监听。如果多次点击就关闭ajax.

例如:

img

img

查看一下这个组件的api,应该提供了事件api,增加一个防抖的函数吧,防抖节流封装可以看这个
https://blog.csdn.net/Alice_czy/article/details/117786811 https://blog.csdn.net/Alice_czy/article/details/117786811

使用全局loading,请求结束之前,全局loading遮住界面,防止操作

受 孤月葬花魂 的启发 弃用了v-model 结合百度的结果 优化了下 完成了类似防抖的减少频率
大概思路是 请求成功后弹出message弹框 当message弹框消失后才可以再次点击发请求 为了提高用户体验给message加了关闭按钮 具体实现代码如下:

html部分:

<el-switch :value="value" @change="change" active-color="#13ce66" inactive-color="#ff4949"></el-switch>

js部分:

    change(value) {
      let doms = document.getElementsByClassName('el-message')[0]
      if (doms == undefined) {
        this.$message({
          message: '请求发送成功',
          showClose: true,
          duration: 1000,
          type: 'success'
        })
        this.value = value
      }