Javascript 如何基于选择下拉项禁用文本框？

基本上，我想要一个下拉列表（或组合框），它位于默认禁用的文本输入字段旁边。我希望能够在选择下拉列表中的特定属性时启用文本字段

我想我的主要问题是我有一个禁用输入的值，我不知道如何根据选择的属性动态更改它

这里是我拥有的相对HTML的一部分

<template>
<v-container class="my-1 mx-5">
    <form>
    <v-select
      v-model="select_property"
      :properties="properties"
      label="properties"
      @change="$v.select_property.$touch()"
      @blur="$v.select_property.$touch()"
    ></v-select>

    <v-text-field
      v-model="custom_path"
      :error-messages="custom_pathErrors"
      :disabled="input_disabled"
      label="Custom Property Path"
      @input="$v.name.$touch()"
      @blur="$v.name.$touch()"
    ></v-text-field>

...

---

选择

prop4

时，应将

input\u disabled

设置为

false

，此时文本字段应允许用户输入文本而不会出现问题。我遇到的问题是我不知道如何更改

禁用的输入

您可以这样设置数据（将设置状态替换为用于设置数据的watever函数）：

---

您可以这样设置数据（将setState替换为用于设置数据的watever函数）：

---

Vuejs提供计算属性，这正是您所需要的，计算属性的值是动态设置的，请执行以下操作：

computed: {
    input_disabled() {
        return data.properties[3] ? false : true;
    }
}

data.properties[3]的每次更新都会触发此计算并更新输入值。

---

如果您使用此选项，请不要在数据上声明已禁用输入，请在此处为您包含此变量

Vuejs提供计算属性，这正是您需要的，计算属性的值是动态设置的，请执行以下操作：

computed: {
    input_disabled() {
        return data.properties[3] ? false : true;
    }
}

data.properties[3]的每次更新都会触发此计算并更新输入值。 如果您使用此选项，请不要在数据上声明已禁用输入，请在此处为您包含此变量

computed: {
    input_disabled() {
        return data.properties[3] ? false : true;
    }
}