解决 按钮多次点击重复提交问题
2019-05-27 本文已影响0人
zsanpang
业务开发出现点击确定出现两次调用,解决如下代码:
<el-button type="primary" @click="contractBtn" :disabled="isDisable">保 存</el-button>
<script>
export default {
return {
isDisable: false,//重复提交
},
methods: {
contractBtn() {
this.isDisable = true;
let contents = {
carFundProviderId:this.carFundProviderData.id,
title:this.title,
number:this.number,
startTime:this.startTime,
endTime:this.endTime,
useType:this.useType?this.useType:0,
hasGPS:{
maxPrice:this.hasMaxMoneny,
minPrice:this.hasMinMoneny,
rules:this.hasGPSData,
},
noGPS:{
maxPrice:this.noMaxMoneny,
minPrice:this.noMinMoneny,
rules:this.noGPSData,
},
};
return axios({
method: 'post',
url: `${api}/admin/contract/add`,
params: {
contents: aexEncrypt(contents)
},
data: this.filesList
}).then(res => {
this.isDisable = false;
let data = JSON.parse(aesDecrypt(res.data.content));
if (data.code == 200) {
this._layerFn("添加成功");
setCookie("currentMenu", this.$route.meta.menu);
this.$router.push({name: 'providerList'});
} else if (data.code == 201) {
this._layerFn(data.msg)
} else if (data.code == 202) {
window.location.href = data.data.loginUrl
}
}).catch(err => {
this._layerFn(err)
});
},
}
}
</script>
最后还需要提醒大家一点,本篇文章中的例子仅供参考学习,切误将本篇文章中的代码直接使用在正式项目当中。希望以上代码对大家有所帮助。