Conflict between blur event and click event in input box

This phenomenon occurred several times when I was writing a project , But generally, I didn't react , Thought that the code was written incorrectly and there was no trigger method .

For example, the following , This is a previous one vue Problems with the project ：

When printing, I found blur Method executed , But the click event of the list is not executed .

reason ： In fact, this is the issue of execution priority between events ,blur The priority ratio click high , therefore blur The event executes first and hides the list , The list does not trigger click Event

resolvent ：
1、 The priority of other events can be higher than blur High events
2、 Use setTimeout Time delayer

	hiddenList(){
    
      setTimeout(() => {
    
        this.isshowList=false
      }, 200);
    },

200 Milliseconds is a more appropriate value after debugging , If the click event is too small, it may not be executed sometimes , The effect of a large page is poor