How to solve the problem of repeatedly submitting by clicking the button

vue developer I used @ click.once to trigger an event to prevent repeated call-up of the payment interface, but if the user chooses to cancel or click * in WeChat Pay, this button cannot be adjusted again. What to do

@ click.once= "toPay ()"

toPay () {

//

}

the expected result is that it is called only once, and if the user clicks to cancel the payment, this button returns to the state that can only be clicked once

Vue.js javascript html5
Jun.24,2022

self-control. Add a tag default value of true . toPay determines this tag, true executes it, and once executes it, it changes to false .
cancel or time out, you can change to true

you can refer to
data to define a field that can be submitted, such as canPay . True means payment can be made, and vice versa

. 
<button @click="toPay" :disabled="!canPay"></button>
<button @click="canclePay"></button>

data(){
    return {
        canPay: true
    }
},
methods: {
    toPay(){
        if(this.canPay){
            this.canPay = false
            //
            axios.post('/api/xxx',{})
                .then(res => {
                    //
                })
                .catch(err => {
                    //canPaytrue
                    this.canPay = true
                })
        }else {
            console.log('')
        }
    },
    canclePay(){
        //
        //canPaytrue
        this.canPay = true
    }
}

Previous: Under MAC, nginx accesses virtual domain names instead of downloading php files.

Next: How to separate multiple names in vue by commas?

css mysql arrays josn react html typescript webpack npm sass R objective-c .net sql-server jquery python-3.x angularjs django angular excel regex iphone ajax linux xml pandas vba spring database wordpress string wpf xcode windows bash postgresql oracle multithreading eclipse list firebase algorithm macos forms image scala visual-studio azure bootstrap spring-boot react-native python-2.7 docker performance function winforms matlab powershell apache dataframe api sqlite numpy rest shell selenium flutter dart maven loops qt swing android-studio csv express file class tensorflow sorting codeigniter perl
© 2021 CodesHelper
Advertising Contact us About us
Menu