结构:
<div :class="isDisabledFlag? 'disabled': ''" class="email_btn" @click="emailNext">下一步</div>
样式:
.email_btn {
display: block;
margin: 8vw auto 0;
width: 100%;
height: 10.66vw;
line-height: 10.66vw;
border-radius: 5.33vw;
background-color: #FF8C00;
text-align:center;
color: #FFF;
font-size: 3.73vw;
}
.disabled {
pointer-events: none;
cursor: not-allowed;
opacity: 0.5;
}
js部分:
emailNext: function () {
if(!this.emailValue){
vant.Toast('请填写您的邮箱地址')
// MessageBox.info("请填写您的邮箱地址");
return
} else{
this.isDisabledFlag = true
console.log(111)
var _this = this;
var email = this.emailValue;
$.ajax({
url:"${rc.contextPath}/url",
type: "POST",
data:{
'email':email
},
dataType : "json",
success:function(data){
if(data.errType == "0"){
vant.Dialog.confirm({
title: '提示',
confirmButtonColor: '#007AFF',
cancelButtonColor: '#007AFF',
message: '666'
}).then(function () {
window.location.href=‘前往下一个页面’;
}).catch(function () {
console.log('取消')
})
} else if(data.errType == "1"){
vant.Dialog.alert({
title: '提示',
messageAlign: 'left',
message: data.errMsg
})
} else if(data.errType == "20"){
window.location.href=‘前往下一个页面’
}
_this.isDisabledFlag = false
},
error:function (err) {
console.log(err)
_this.isDisabledFlag = false
}
});