uniapp 输入有值后按钮变色

我们在开发中难免会遇到一些登录注册输入框中的值为空时,按钮的状态变成为不可点击的状态,当输入框有值后就把按钮变为可点击的状态

代码部分:

<input placeholder="请输入手机号" name="input" type="number" v-model="phone" @input="changeDisabled"></input>@input: 输入框输入的实时监听
<button class="bg-blue text-center login_btn" :disabled="disabled">登录</button> 
data() {
    return {
        disabled: true
    }
}

changeDisabled(e) {
    // console.log(e)
    if (e.detail.value != "") {
        this.disabled = false;
    } else {
        this.disabled = true;
    }
},

效果图:

 

有值后:

 

 

posted @ 2020-09-10 18:35  奔跑的前端猿  阅读(2261)  评论(0编辑  收藏  举报