如果Vuejs中沒有數據，如何禁用按鈕？

Question

 <input:type="passwordFieldType" v-model="user.password" id="password" name="password" class="input-section-three-register" value="" placeholder="Enter new password" autocomplete="off" @change="disabledSubmit" /> <input:type="passwordFieldTypetwo" v-model="user.confirmPassword" id="confirmPassword" name="confirmPassword" placeholder="Confirm password" value="" autocomplete="off":disabled="user.password.length < 8" @change="disabledSubmit" /> mounted() { this.disabledSubmit(); },

 disabledSubmit() { this.disableButton = this.user.password.length<8 || this.$v.user.password.$error || this.user.password.==this.user;confirmPassword, },

 <button type="submit":disabled="disableButton" > pp </button>

上面代碼的問題是，即使最初沒有輸入任何數據，我也可以在單擊按鈕后繼續。 只有在我輸入一些數據禁用后才起作用。

Answer 1

您可以通過完全刪除變量this.disableButton來修復它，而是使用 function：

getSubmitDisabled() {
     return this.user.password.length<8 || 
         this.$v.user.password.$error ||
         this.user.password!==this.user.confirmPassword; 
},

然后你可以像這樣使用它：

<button :disabled="getSubmitDisabled()">