Small knowledge, big challenge! This paper is participating in theEssentials for programmers”Creative activities.
Hello! My last article # Vuex is a simple and detailed description, which has a good effect. Compared with the previous article, the number of page views, likes and comments has been significantly improved; Thank you for your support! Please give more advice in the future; Today we’re going to revisit a problem THAT I had when I was writing a project; Is the element UI Message pop-up box repeatedly click the pop-up question; In the last company encountered, the company asked the big guy, did not expect so simple!
The text begins
First let’s take a look at the renderings of the problem
In fact, this effect to the user’s experience is very bad, do not rule out some users using this function is very unfriendly will be continuous a lot of points; The key is that a series of prompts will not wait for the next one to disappear, until all the prompts disappear or take some time to complete the automatic shutdown;
The solution
Ok, so let’s look at the solution to this problem; In the code
// The method that executes the popbox again will only execute once within the specified time; / / this is will be continuous click event messageCilck () {if (this. PreventDuplicateClicks (2000)) {return false. } this.$message.success(" set successfully!!!!!!!!") ); }, // The message preventDuplicateClicks(timeLengtn) {// Disable as button if (! this.isClick) { this.isClick = true; setTimeout(() => { this.isClick = false; }, timeLengtn); return false; } else { return true; }},Copy the code
How about looking at the code and feeling pretty simple
This method works just as well as the anti-shake function, and I often use it for back-to-back click-requests; Well, you can try it; $message.success(” set successfully!!!!!!!!”) ); Instead, the method called by the request interface of the request would be fine;
conclusion
It’s the end of the article; I hope this article can help you;
Then (like + comment + follow) if you have any questions, you can communicate with each other