属性 更改后触发函数 VueJS

Question

我想在 ID_AnUniversitarAbsolvire 和 ID_Facultate 之后调用最后一个 axios。我尝试在 watch:{} 中构建一个函数，但没有成功。有谁知道我该怎么做？非常感谢任何建议。

<v-col class="d-flex" cols="12" sm="4">
        <v-select
          :items="anUniversitar"
          item-text="Denumire"
          item-value="ID_AnUniv"
          label="An Universitar"
          v-model="ID_AnUnivAbsolvire"
          :rules="[v => !!v || 'Alege un an universitar']"
        ></v-select>
      </v-col>
        <v-col class="d-flex" cols="12" sm="4">
          <v-select
            :items="facultateList"
            item-text="Denumire"
            item-value="ID_Facultate"
            label="Facultate"
            v-model="ID_Facultate"
            :rules="[v => !!v || 'Alege facultatea']"
          ></v-select>
        </v-col>

data: () => ({
      ID_AnUnivAbsolvire: '',
      ID_Facultate: '',
    }),
methods: {
},
created() {
axios.get('http://193.254.231.70/api/agsis.api/AnUniversitar/AnUniversitar_GetCurrentAndPrevious')
        .then(res => {
          const data = res.data;
          for(const item of data) {
            this.anUniversitar.push(item);
          }
        }),
      axios.get('http://193.254.231.70/api/agsis.api/Facultate/FacultateList')
        .then(res => {
          const data = res.data;
          for(const item of data) {
            this.facultateList.push(item);
          }
      }),
      axios.get(`http://193.254.231.70/api/agsis.api/Facultate/SpecializareListByFacultateAnUniv?ID_Facultate=${this.ID_Facultate}&ID_AnUniv=${this.ID_AnUnivAbsolvire}`)
          .then(res => {
            const data = res.data;
            for(const item of data) {
              this.specializareFacultate.push(item);
            }
        })
    },

Answer 1

您可以通过以下方式实现：

1. 将您的属性嵌套在一个对象中
2. 在 watch 生命周期挂钩中观察那个对象
3. 将最后一个 axios 放在 methods
中

<script>
export default {
  name: "App",
  data: () => ({
     IDs: {
      anUnivAbsolvire: '',
      facultate: '',
     }
    }),
    watch: {
      IDs: {
      handler(newValue, oldValue) {
       if(newValue.anUnivAbsolvire && newValue.facultate) {
           this.lastAxios()
         }
      },
      deep: true
    }
    },
    methods: {
      lastAxios() {
        // your axios
      }
    }
};
</script>