Sencha Touch 1.1.1嵌套JSON Store加載

Question

嗨，大家好，我希望有人可以幫助我，我真的卡住了，雖然它是一些已經被回答的該死的初學者問題，我向你保證我閱讀了所有的答案帖子，但仍然無法讓它工作。

我正在使用Sencha Touch 1.1.1並嘗試使用嵌套的JSON數據加載此Store。這裏的代碼：

Ext.regModel("UserData", { 

     hasMany : [{ 
      name : "id", 
      type : "integer", 
     },{ 
      name : "username", 
      type : "string", 
     },{ 
      name : "password", 
      type : "string", 
     }] 

    }); 

    var userdata = 
     {"users": [ 
        { 
         "id": 16, 
         "username": "bla@bla.com", 
         "password": "bla", 
        }, { 
         "id": 17, 
         "username": "bla@bla.com", 
         "password": "bla", 
        } 
       ] 
     }; 


    var myStore = new Ext.data.Store({ 

     model : 'UserData', 
     data : userdata, 
     proxy : { 
      type : 'ajax',    

      reader : { 
       type : 'json', 
       root : 'users'  // not working   
      } 
     } 

    }); 

    var myList = new Ext.List ({ 

     fullscreen : true, 
     store : myStore, 
     grouped : false, 
     itemTpl : '<div>{username}</div>' 

    }); 

返回未捕獲類型錯誤：參數列表有錯誤的類型。當我用一個外部數組封裝器重寫JSON時，它可以工作，但是使用錯誤的根（不是用戶），我明確地看到了這樣的例子，這個例子在root：'value'下工作。

var userdata = 
    [ {"users": [ 
       { 
        "id": 16, 
        "username": "bla@bla.com", 
        "password": "bla", 
       }, { 
        "id": 17, 
        "username": "bla@bla.com", 
        "password": "bla", 
       } 
      ] 
    } ]; 

我在想什麼？

Answer 1

如果我沒有弄錯，在你的「UserData」模型中，它應該是fields而不是hasMany。

並嘗試將您的json數據放入一個單獨的json文件中，並在商店代理中找到路徑。

var myStore = new Ext.data.Store({ 
model: 'UserData', 
autoLoad: true, 
proxy: { 
    type: 'ajax', 
    url: 'test.json', 
    reader: { 
     type: 'json', 
     root: 'users' 
    } 
} 
}); 

我測試了它，它在這裏工作正常。這是我的完整代碼。

Ext.regModel("UserData", { 

    fields: [ 
      {name: 'id', type:'int'}, 
      {name: 'username', type:'string'}, 
      {name: 'password', type:'string'} 

    ] 
}); 


var myStore = new Ext.data.Store({ 
    model: 'UserData', 
    autoLoad: true, 
    proxy: { 
     type: 'ajax', 
     url: 'test.json', 
     reader: { 
      type: 'json', 
      root: 'users' 
     } 
    } 
}); 


var app = new Ext.Application({ 
    name: 'TestApp', 
    useLoadMask: true, 
    launch: function() { 


     TestApp.views.listToolbar = new Ext.Toolbar({ 
      title: 'Foo Bar', 
      layout: 'hbox' 
     }); 

     TestApp.views.list = new Ext.List({ 
      id: 'list', 
      store: myStore, 
      emptyText: 'Nothing', 
      itemTpl: '<div class="username">{username}</div>', 
     }); 

     TestApp.views.container = new Ext.Panel({ 
      layout: 'fit', 
      html: 'this is the container', 
      dockedItems: [TestApp.views.listToolbar], 
      items: [TestApp.views.list] 
     }); 

     TestApp.views.viewport = new Ext.Panel({ 
      fullscreen: true, 
      layout: 'card', 
      cardAnimation: 'slide', 
      items: [ 
       TestApp.views.container 
      ] 
     }); 
    } 
});