从 JSONP 回调返回数据

Question

我有一个获取 jsonp 数据的类。我想简单地返回一个值，但无法这样做。回调不会更新类属性 - 不确定这是时间问题还是范围问题

Ext.define("App.ContentManager", {
    extend: "Ext.util.Observable",
    singleton: true,

    data: 'empty',
    getData: function() {
        this.doLoad();
        console.log(a.data) //not correct - shows original value
        return this.data;

    },
    doLoad: function(url) {
        var a = this;
        Ext.util.JSONP.request({
            url: "http://example.com/somejson",
            callbackKey: "callback",
            callback: function(c) {
                a.data = c;
                console.log(a.data) //correct json data is here
            }
        })
    },
});

Answer 1

当然是时间问题。使用 getDate 函数中的 doLoad()，您只需启动请求，而无需等待它完成才能在下一行中准备好数据。您只需在 doLoad 方法的 callback: function 中准备好数据。因此，无论您需要做什么，最好在一个函数中发送请求，然后在 callback:function 中设置一个将使用返回数据的函数。

更新

另外我刚刚注意到还有一个范围问题。您可以通过添加 a 在 JSONP 请求中传递范围

          url: "http://example.com/somejson",
        scope: this,    //this line
  callbackKey: "callback",

，然后在 getDate 中您应该： this.data 因为 a 是 doLoad方法。

Answer 2

正如现有注释中所述，由于 doLoad 方法异步检索数据，因此无法直接从方法调用返回结果。您的两个选择是：

• 使用回调参数定义您的方法（这通常在 Ext 本身中完成），以便在 JSONP 回调中执行传递的回调函数，传递返回的数据。
• 定义您的类可以从 JSONP 回调触发的自定义事件，并将数据作为事件参数传递。这更适合多个组件可能对 JSONP 调用的结果感兴趣的情况。

或者你甚至可以两者都做（未经测试）：

doLoad: function(options) {
    var me = this;

    Ext.util.JSONP.request({
        url: options.url,
        scope: me,
        callbackKey: "callback",

        callback: function(data) {
            me.fireEvent('dataloaded', me, data);
            if (options.callback) {
                options.callback.apply(options.scope || me, [data]);
            }
        }
    })
}