如果满足两个条件之一，则启用按钮

Question

我正在处理这个表单，根据在 combobox 上选择的内容，显示另一个 combobox 或输入字段。 并且该按钮应该被禁用，直到在 combobox 上选择了某些东西或输入的长度超过 3 。 我不能让最后一点工作。

我试过这个：

<button type="submit" class="btn btn-primary btn-block" :disabled="clientNumberInput.length < 3 || selectedClient === null">{{labels.lblButtonSearch}}</button>

这个计算属性：

searchButtonEnabler() {
    if (this.clientNumberInput.length < 3 || this.selectedClient === null)
        return true
    else
        return false
}

但它不起作用。 我相信这是因为 OR 在 Javascript 中的工作方式。 但我想不出任何其他方法来做到这一点。

编辑：根据要求，我添加了输入字段代码。

<input v-if="selectedSearchByFilter != null && selectedBusiness.id == 3 && selectedSearchByFilter.id == 2"
                           name="clientNumber"
                           type="text"
                           class="form-control"
                           v-model="clientNumberInput"/>

clientNumberInput 的值通过 v-model 更新。 我有两个 p 标签显示 clientNumberInput 和 selectedClient 的值，它们按预期工作。

Answer 1

我最初误解了“禁用，直到在 combobox 上选择某些东西或输入的长度超过 3”。 实际上你需要clientNumberInput.length < 3 && selectedClient === null （或clientNumberInput.length < 3 && !selectedClient ）

逻辑：

• 启用 = 数字 || 客户
• 所以：禁用=！启用=！（数字||客户端）=！数字&&！客户端

Answer 2

您的 object 应该是这样的，

selectedSearchByFilter: {id:2},
selectedBusiness: { id:3}

试试这个小提琴链接