Vue JS Make下拉选择在选择选项时运行查询

Question

我对 Vue 很陌生，遇到了一个问题。我有几个下拉选择菜单，它们从 Axios 请求中返回信息 虽然 select t 仅在我点击提交按钮时才有效。我希望它在用户进行下拉选择时运行。我无法弄清楚我错过了什么。有人可以帮忙吗？

我在下面包含了一些代码。谢谢

html:

 <div class="form-group col-md-6">
                      <label for="subject" class="control-label">Subject</label>
                      <select
                        v-model="subject"
                        class="form-control"
                        :disabled="selectDisabledSubject"
                      >
                        <option disabled value="">Select subject</option>
                        <option
                          v-for="subject in uniqueSubjects"
                          :key="subject"
                          :value="subject"
                        >
                          {{ subject }}
                        </option>
                      </select>
                    </div>

vue

uniqueSubjects() {
      const metaVFees = this.results
        .filter((result) => result.metaData && result.metaData.V)
        .map((item) => item.metaData.V)
        .filter((subject, i, arr) => arr.indexOf(subject) === i);
      // Split multiple subjects in strings and store in an array
      let subjects = [];
      metaVFees.forEach((item) => {
        const splitArr = item.split(", ");
        subjects = subjects.concat(splitArr);
      });
      return subjects
        .sort()
        .filter((subjects, i, arr) => arr.indexOf(subjects) === i);
    },

Answer 1

你可以使用vueWatchers

watch:{
 subject(newVal){
  // call the function you normally call with submit click
 }
}