Как в Vue кнопкой отключать input?

Question

[Phoeniks]

Как можно отключить кнопкой ввод для Inputa, а другой включать?

Answer 1

[0xD34F]

Добавляем в компонент свойство, которое будет управлять активностью input'а:

const active = ref(false);

<input :disabled="!active">

Ну а дальше достаточно назначать этому свойству значение. Можно воспользоваться кнопками, как вы и задумывали:

<button @click="active = true">on</button>
<button @click="active = false">off</button>

Но есть и иные варианты. Например, чекбокс:

<label>
  <input type="checkbox" v-model="active">
  включить
</label>

Или тоже кнопки, но другие - радио:

<label v-for="(n, i) in [ 'on', 'off' ]">
  <input type="radio" :value="!i" v-model="active">
  {{ n }}
</label>

Да хоть выпадающий список:

<select v-model="active">
  <option
    v-for="(n, i) in [ 'on', 'off' ]"
    v-text="n"
    :value="!i"
  ></option>
</select>

Вот как-то так.