ajax - Vue.js 2.0 - 在 AJAX Axios 方法中传递参数

Question

我需要在使用 ajax axios 的方法中传递参数。

    var app = new Vue({
    el: '#app',
    data: {

        urlAdmission: 
        admissions: [
                        { name : 'asdf'},
                        { name : 'sd'}
                    ]
    },
    mounted: function(){
        this.allAdmissions()

    },
    methods: {

        allAdmissions: _.debounce( function(){
            var app = this
            axios.get('http://localhost/school/api/hello')
                .then( function(response ){
                    app.admissions = response.data.admissions
                })
                .catch( function(error){
                    console.log(error)
                })
        })
    }
});

正如您在 mounted 中看到的那样，我调用方法 this.allAdmissions() 我需要传递一个参数，以便我可以重用该函数。例如 this.allAdmissions(' http://localhost/school/api/hello ')。然后在axios.get('url')中使用它。谢谢

Answer 1

看起来您正在尝试做的是创建一个可以接受 url 并将 url 的结果绑定(bind)到数据中的变量值的函数。以下是您可以如何做到这一点。

methods: { 
  allAdmissions: _.debounce(function(url, value){ 
    axios.get(url)
      .then(function(response){ 
        this[value] = response.data.admissions 
      }.bind(this)) 
      .catch(function(error){ 
        console.log(error) 
      }) 
  })
}

然后，如果你像这样调用那个方法，

this.allAdmissions('http://localhost/school/api/admissions‌​', "admissions")

allAdmissions 会将您数据的 admissions 属性设置为您的调用结果。如果您总是想使用 response.data.admissions 则此方法有效，因为您对其进行了硬编码。如果您也希望它也是可变的，您可以像这样传递第三个值

methods: { 
  getSomeData: _.debounce(function(url, value, responseValue){ 
    axios.get(url)
      .then(function(response){ 
        this[value] = response.data[responseValue] 
      }.bind(this)) 
      .catch(function(error){ 
        console.log(error) 
      }) 
  })
}