2011-11-10 3 views
1

jsonp 데이터를 가져 오는 클래스가 있습니다. 단순히 가치를 반환하고 싶지만 그렇게 할 수는 없습니다. 그것은 물론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 
      } 
     }) 
    }, 
}); 
+2

콜백 비동기, 그래서 a.data 당신이 doLoad에게 – Joe

답변

2

이 문제 타이밍되는 타이밍 또는 범위 문제가 있는지 확실하지 않습니다 - 콜백 클래스의 속성을 업데이트하지 않습니다. getDate 함수에서 doLoad()을 사용하면 요청을 시작하기 만하면 데이터가 다음 행에 준비 될 때까지 기다리지 않아도됩니다. doLoad 방법의 callback: function에만 데이터가 준비되어 있습니다. 그래서 당신이해야 할 일은 하나의 함수로 요청을 보내고 그 다음에 callback:function에 반환 된 데이터를 사용할 함수가 있어야합니다.

이 또한 그냥 발견

업데이트도 범위의 문제입니다. a 이후 this.datadoLoad 방법에서 지역 변수이다 : 당신은 당신이해야 GETDATE에서 다음

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

을 추가하고 함께 JSONP 요청의 범위를 통과 소리.

+0

감사를 호출 후 즉시 반환되지 않습니다 - 그것은 이후 일리노이 마크 올바른로이 답변 첫 번째 - 나는 내 선생님보기에서 json을로드하고 html에 적용하는 작업을 마쳤습니다. – cyberwombat

1

기존 주석에서 언급했듯이 doLoad 메서드는 데이터를 비동기 적으로 검색하기 때문에 메서드 호출에서 직접 결과를 반환 할 방법이 없습니다. 당신의 두 가지 옵션은 다음과 같습니다

  • 가 반환 된 데이터를 전달, 전달 된 콜백 함수를 실행하는 것 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]); 
      } 
     } 
    }) 
}