Javascript 在Vue.js中加载页面后如何使用$http.get中的数据？

我不知道如何在

$http.get

请求完成后在Vue.js中执行函数。在下面的示例中，我希望在页面加载后立即自动选择

foobar

元素，但这仅在存在警报时有效

new Vue({

    el: '#foo',

    data: {
        foobar: [],
        foobar_selected: []
    },

    ready: function() {
        this.fetchFoobar();
        alert('silly');
        this.selectFoobar(2);
    },

    methods: {
        fetchFoobar: function () {
            this.$http.get('foobar_to_fetch', function (foobar_fetched) {
                this.foobar = foobar_fetched;
            })
        },
        selectFoobar: function (index) {
            this.foobar_selected.push(this.foobar[index]);
        }
    }

});

-

但这并不是：

this.$http.get('foobar_to_fetch', function (foobar_fetched) {
    this.foobar = foobar_fetched;
}, this.selectFoobar(2));

在Vue.js中执行此操作的正确方法是什么

---

我正在使用Vue 0.11.10和Vue资源0.1.16。

get

具有以下签名：

get(url, [data], [success], [options])

数据

在方括号中，这意味着该参数是可选的。由于

数据

定义为：

对象|字符串-作为请求消息数据发送的数据

您没有将对象/字符串作为第二个参数传递给函数。这意味着，您传入的第二个参数被解释为成功回调函数它不一定是第三个参数

如果您这样做：

this.$http.get('foobar_to_fetch', function(data, status, request) {
  this.foobar = data;
  this.selectFoobar(2);
});

---

它在理论上应该是可行的。不过，根据我对您在问题中链接的Vue文档的浏览，这只是一个猜测。

谢谢<代码>状态和请求甚至都不是必需的。

this.selectFoobar（2）

只需位于

get

函数内部，而不必在其后面。真不敢相信我没有试过…@mate2code是的，可能没有必要。我只是想告诉大家函数是成功回调。此外，即使不是这样，您也必须将该命令包装在如下函数中：

function（）{this.selectFoobar（2）}

，以便将其传递给的函数可以在以后执行该代码。这就是回调的本质；在函数中包装代码，以便您可以将它们传递给其他函数，以便在适当的时候执行您的函数。感谢您的澄清。函数是成功回调。这是我错过的，因为我考虑的是“get（url，[data]，[success]，[options]）的第n个参数”。

get(url, [data], [success], [options])

this.$http.get('foobar_to_fetch', function(data, status, request) {
  this.foobar = data;
  this.selectFoobar(2);
});