0

我一直在尝试在 sencha touch 2.1.1 中进行动态轮播，它从 wordpress json 数据中获取图像。但是当我调用存储中的负载侦听器时，它会给出错误。我在另一个演示煎茶应用程序上尝到了这个，它在那里工作正常，但是当我在这里添加它时，它显示了错误

Uncaught TypeError: Cannot call method 'add' of undefined

我在这里分享我的视图、模型和存储文件

Ext.define('Flugelsoft.view.Portfolio', {
    extend:'Ext.Container' ,
    xtype: 'portfolio',
    fullscreen: true,
    //store:'Portfolios',

requires: ['Flugelsoft.store.Portfolios', 'Ext.dataview.List', 'Ext.Img','Ext.carousel.Carousel'],

    config: {
            layout: {
                        type: 'fit'
             },

            items: [

            {
                    xtype: "carousel",
                    id: 'carouselid'

            }
        ]



    }
});

store.js 文件

var token=localStorage.getItem("access_token");

Ext.define("Flugelsoft.store.Portfolios", {
 extend: "Ext.data.Store",
requires: ["Ext.data.proxy.JsonP"],
config: {
model: "Flugelsoft.model.Portfolio",
autoLoad: true,

proxy: {
    type: 'jsonp',
    url: 'http://www.flugelsoft.net/?json=get_category_posts&category_id=2&access_token='+token,
    reader: {
        type: 'json',
        rootProperty: 'posts'
        }
    },  

}    

   });

var newPanel = Ext.create('Flugelsoft.store.Portfolios', {   
    listeners:{
    load: function( me, records, successful, operation, eOpts ){ 
        console.log("data loaded", records);
        myCarousel = Ext.getCmp('carouselid');
        for(var i=0; i<records.length; i++){

         //THE ERROR IS GENERATING IN THIS LINE myCarousal.add 
            myCarousel.add({
                xtype: 'image',
                src: records[i].get('thumbnail')
            });
        }
    }
}

});

模型.js 文件

Ext.define('Flugelsoft.model.Portfolio',{
           extend:'Ext.data.Model',

           config:{
               fields: [{name: 'title', type: 'string'},{name: 'content', type: 'string'},{name:'thumbnail',type:'image/png'}]
          }


});

先感谢您

4

1 回答 1

2

首先，您应该Portfolio在调用之前在视口中添加视图Ext.getCmp('carouselid');

模型

Ext.define('GoodNews.model.Portfolio',{
   extend:'Ext.data.Model',
   config:{
      fields: [{name: 'title', type: 'string'},
               {name: 'content', type: 'string'},
               {name:'thumbnail',type:'string'}]
       //thumbnail should be url for accessing picture from the server 
   }
});

店铺

    Ext.define("GoodNews.store.Portfolios", {
    extend: "Ext.data.Store",
    requires: ["Ext.data.proxy.JsonP"],
    config: {
        model: "GoodNews.model.Portfolio",
        autoLoad: true, 
                proxy: {
                  type: 'jsonp',
                  url: 'http://www.flugelsoft.net/?json=get_category_posts&category_id=2&access_token='+token,
                   reader: {
                     type: 'json',
                     rootProperty: 'posts'
                   }
         },  
     } 
});

添加portfolio 

Ext.Viewport.add({xtype : 'portfolio'});

 var newPanel = Ext.create('GoodNews.store.Portfolios', {   
    listeners:{
        load: function( me, records, successful, operation, eOpts ){ 
            console.log("data loaded", records);
            myCarousel = Ext.getCmp('carouselid');
            for(var i=0; i<records.length; i++){
              myCarousel.add({
                xtype: 'image',
                src: records[i].get('thumbnail')
              });
            }
        }
    }
    });

sencha touch中没有image/png字段类型。以下类型仅有效

  1. 自动：对象
  2. 布尔值：对象
  3. 日期：对象
  4. 浮动：对象
  5. 整数：对象
  6. 编号：对象
  7. 字符串：对象
于 2013-08-19T17:36:36.710 回答