Comment éviter les demandes en double dans vuejs

Méthode Vuejs pour éviter les requêtes répétées : 1. Ajoutez le fichier personnalisé "preventReClick.js" ; 2. Référencez PreventReClick dans main.js ; 3. Ajoutez "v-preventReClick" au bouton.

L'environnement d'exploitation de cet article : système Windows 7, Vue version 2.9.6, ordinateur DELL G3

Comment éviter les requêtes répétées dans vuejs ?

VUE empêche les clics multiples et les demandes répétées

1. Ajoutez un fichier personnalisé PreventReClick.js

import Vue from 'vue'
const preventReClick = Vue.directive('preventReClick', {
    inserted: function (el, binding) {
        el.addEventListener('click', () => {
            if (!el.disabled) {
                el.disabled = true
                setTimeout(() => {
                    el.disabled = false
                }, binding.value || 3000)
            }
        })
    }
});
export { preventReClick }

2. Référence

import preventReClick from './store/preventReClick' //防多次点击，重复提交

dans main.js

3. Ajoutez v-preventReClick sur le bouton

<el-button class="common-button" size="small" type="primary" @click="handleSave(&#39;form&#39;)" v-preventReClick>保 存</el-button>

Recommandé : "Les 5 dernières sélections de didacticiels vidéo vue.js"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!