0👍
You can add a boolean variable to store current execution state. And then check the state before sending API request in your "saveAPI".
For Example:
data() {
return {
isExecuting: false,
}
},
methods: {
async saveButton () {
var self = this
this.$dialog.confirm({
message: 'SAVE',
canCancel: ['escape', 'button'],
cancelText: 'CANCEL',
confirmText: 'OK',
onConfirm: function () {
self.saveAPI()
},
onCancel: function () {
}
})
},
async saveAPI() {
if (this.isExecuting) {
return;
}
this.isExecuting = true;
try {
let data = await API.saveAPI
return data
} catch (error) {
} finally {
this.isExecuting = false;
}
}
}
Also as another solution you can try to add ".once" modifier to a Save Button’s @click event handler, but you didn’t show your template so I don’t quite sure about this way.
@click.once="saveButton"
Check this please maybe it will be helpful – https://vuejs.org/guide/essentials/event-handling.html#event-modifiers
- [Vuejs]-Trouble defining interface correctly TS2339: Property 'x' does not exist on type 'y' and with using a vue ref
- [Vuejs]-Can't stop text gradient animation from resetting when complete
Source:stackexchange.com