Explication détaillée du traitement anti-tremblement et de limitation des événements de clic de Vue

Fonction anti-tremblement
Définition: Une fois l'événement déclenché plusieurs fois, la fonction de traitement d'événement n'est exécutée qu'une seule fois, et elle est exécutée à la fin de l'opération de déclenchement.

//在vue中对click添加防抖处理
const on = Vue.prototype.$on
// 防抖处理
Vue.prototype.$on = function (event, func) {
    
    
  let timer
  let debounce = func
  if (event === 'click') {
    
    
    debounce = function () {
    
    
      clearTimeout(timer)
      timer = setTimeout(function () {
    
    
        func.apply(this, arguments)
      }, 500)
    }
  }
  on.call(this, event, debounce)
}

Limitation de fonction
Définition: Une fois qu'un événement de fonction est déclenché, il ne peut pas être appelé en continu dans un court intervalle de temps. L'appel de fonction suivant ne peut être effectué qu'après l'intervalle de temps spécifié après la dernière exécution de la fonction.

//在vue中对click添加节流处理
const on = Vue.prototype.$on
  
// 节流
Vue.prototype.$on = function (event, func) {
    
    
  let previous = 0
  let throttle = func
  if (event === 'click') {
    
    
    throttle = function () {
    
    
      const now = new Date().getTime()
      if (previous + 1000 <= now) {
    
    
        func.apply(this, arguments)
        previous = now
      }
    }
  }
  on.call(this, event, throttle)