我如何 return 来自 this.$http.get 在 vue js 中的数据

Question

您好，我在 laravel 5 中使用 vue js 在 ajax 调用中返回数据时遇到问题。我有一个状态数组，并在循环内调用 ajax 的函数。现在的问题是 ajax 似乎无法返回值。这是我的代码：

ready: function() {

    var dData = {};

    for (var i=0; i<this.pState.selectedState.length; i++){
        dData = this.displayCounty(this.pState.selectedState[i])
    }
    console.log(dData);

},
methods:{

    displayCounty: function(val){
        var nData = {};

        // ajax get County list
        this.$http.get('/api/counties/' + val )
            .success(function(counties){
               return counties;
            })
            .error(function(){

            }) //ajaxcall

    }// displaCounty
}

有什么想法吗？

Answer 1

我认为您误解了 $http.get 的异步性质。 return counties 的 return 不会影响 displayCounty 的 return 值。 displayCounty returns null 立即和 return counties 后来什么都不做。

在这种情况下使用的一个好策略是在视图模型上设置 success 回调 counties。然后你可以在 counties 上设置一个观察者并在数据发生变化时处理它。

Answer 2

如果您只想将返回的结果分配给一个变量，那么试试这个：

ready: function() {
    this.getCounties;
},

data: {
    counties: []
},

methods:{

    getCounties: function(val){

        // ajax get County list
        this.$http.get('/api/counties/' + val )
            .success(function(counties){
               this.counties = counties;
            })
            .error(function(){

            }); //ajaxcall

    } // displayCounty
}

Answer 3

Ready 已替换为 Mounted in Vue.js 2

你应该使用这个：

ready: mounted() {
    this.getCounties;
},

我如何 return 来自 this.$http.get 在 vue js 中的数据

how can i return data from this.$http.get in vue js

ajax

vue.js

laravel-5