为了账号安全,请及时绑定邮箱和手机立即绑定

Axios 在选择时触发调用

Axios 在选择时触发调用

慕田峪9158850 2021-06-10 18:46:50
我从服务器接收多个 json 文件。它们都可以根据年份(2018、2019 和 2020)在不同的 url 上访问。我将这些年预填充到下拉列表中,但现在我想在每次更改值(?year=2018、?year=2019 或 ?year=2020)时使用 axios 调用 get 调用。我还有另一个下拉列表,它预先填充了 ID,但不知道如何将某个 ID 附加到选定的年份。这些下拉列表充当下面呈现的表格的过滤器。所以更清楚的是,当我重新加载时,我会像这样触发当前年份的 get 调用:baseurl?year=2019,通过这个选择,我可以获得所有数据,但是如果我选择一个 ID,这个 ID 需要添加到 url像这样:baseurl?year=2019?id=0我目前的代码:data() { return {  year:[],  id: 0, }},computed: { axiosParams(){  const params = new URLSearchParams();  params.append('year', this.year);  return params; }, //this returns my current year year() {  var now = new Date()  var nowy = now.getFullYear()  return nowy}, //this method makes sure that the dropdown is always preffiled  //with following years - eg. next year I only need 2019, 2020 and  //2021 years() {   var yearsArray = []   var now = new Date()   for (let i = -1; i < 2; i++) {     var nowy = now.getFullYear() + i     yearsArray.push(nowy)   }   return yearsArray },},methods: { getYears: function() {    axios.get('myurl',{     params : this.axiosParams    }    }).then((response) => {      this.year = response.data;      this.table = response.data;    }) }, getId: function() {    axios.get('myurl',{     params : {      year: this.year,      id : this.id    }    }    }).then((response) => {      this.id = response.data;      this.table = response.data;    }) },},created: { this.getYears(); this.getId();}我的 HTML:<select v-model="year"> <option v-model="yearsArray" v-for="year in years">{{year}} . </option></select><select v-model="id"><option v-for="item in id">{{item}}</option> . </select>谢谢!
查看完整描述

1 回答

  • 1 回答
  • 0 关注
  • 143 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信