浅谈表单提交“防抖”问题

656 阅读1分钟

童鞋们,有人的地方就会有江湖,有表单的地方就会有“防抖”,相信大家都碰到过这个问题,都有哪些方法呢?

方法一:定时器

 // 节流,接受一个函数和延迟执行的时间作为参数,多次操作后仅执行最后一次操作debounce (fn, delay = 1500) {  clearTimeout(debounceTimer)// 维护一个timer   debounceTimer = setTimeout(function () {    fn()    clearTimeout(debounceTimer)  }, delay)}

方法二:拦截器(一劳永逸解决)

const _axios = axios.create(config)let pending = []let CancelToken = _axios.CancelTokenlet removePending = (config) => {  for (let i in pending) {    if (pending[i].url === config.url) {      pending[i].cancel()      pending.splice(i, 1)    }  }}_axios.interceptors.request.use(config => {  removePending(config)  config.cancelToken = new CancelToken((v) => {    pending.push({      url: config.url,      cancel: v    })  })  return config}, error => {  return Promise.reject(error)})

这是我项目中“防抖”的解决方法,当然还有好多,比如“函数时间戳”,”写自定义指令“等,欢迎童鞋们补充!