Is there any way to implement such an event modifier or function in VUE

Business background

  • when submitting data on the page
  • often involves preventing repeated clicks
  • is usually handled in the corresponding click event method
  • but it has to be written in every method, which is really troublesome

wishful thinking

  • vue contains a series of modifiers such as once,self
  • can control events
  • is it possible to implement a similar function on your own
  • add delay and the like
  • to the end of the event.
  • then this click event can only take effect once in 300ms?

question

  • may not be an event modifier
  • simply put, this effect can be achieved by adding an attribute or something to the tag.

reference

https://github.com/huangshuwe.

Jun.23,2021

vue does not have such an event modifier, but it is possible to implement such a modifier, but it is not expected to encapsulate such a modifier, because this idea is anti-shake and throttling, and it exists. If you don't know about it, you can go and have a look at it on the Internet.

the principle of anti-shake and throttling is to use timers to control the execution of code. Your problem can be solved like this:

function handClick(){
    if(handClick.timeout){
        return false
    }else{
        handClick.timeout = setTimeout(function(){
            handClick.timeout = undefined
        },300)
    }
    
    //
}
Menu