Как снять флажок выбора при нажатии кнопки (x) в Vue.js?

Question

Как создать функцию или кнопку для поля выбора выбора? Я пытаюсь с

 <input type="reset" value="x" />

но когда я очищаю одно поле, все поля очищаются. Я не уверен, если вам нужен мой код с основными полями выбора? Я принимаю любым способом

Answer 1

Давайте возьмем этот пример.Вы можете сделать это, используя v-модель:

<script src="https://unpkg.com/vue"></script>

<div id="app">
  <p>{{ message }}</p>
  <select v-model="select">
    <option value="">None</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
  </select>
  <button v-on:click="clear">x</button>
</div>

<script>
new Vue({
  el: '#app',
  data: {
    selectvalue: ''
  }
})
</script>

fiddle: https://jsfiddle.net/vpqnh9dt/

Answer 2

Это можно решить вручную, используя обработчики событий .Сделайте:

<input value="x" @click="clearOneField" />

И в ваших методах перехватите сценарий, реализуйте ваш метод:

clearOneField() {
  this.field = null;
}