0

我有一个扩展 Ext.dataview.List 的通用类,它目前列出了我拥有的一组博客:

Ext.define('Blog.view.BlogList',{
extend: 'Ext.dataview.List',
xtype: 'blogList',

config: {
    cls: 'blogList',
    emptyText: 'No blogs found...',
    itemCls: 'blogListItem',
    itemTpl: [
        '<div class="blogThumb"><img src="{image.medium}" /></div>',
        '<div class="blogTitle">{title}</div>',
    ].join(''),
    loadingText: 'Loading blogs...'
    }
});

当有人点击列表中的一项时,我的控制器当前运行方法showBlog. 这是我当前的控制器:

Ext.define('Blog.controller.Main',{
extend: 'Ext.app.Controller',

config: {
    refs: {
                    blogContainer: 'blogContainer',
        blogList: 'blogList'
    },
    control: {
        blogList: {
            itemtap: 'showBlog'
        }
    }
},

slideLeftTransition: { type: 'slide', direction: 'left'},

init: function() {
    console.log('Blog.controller.Main init');
},

launch: function() {
    console.log('Blog.controller.Main launch');
},

showBlog: function(list, index, element, record) {
    console.log('showing blog #'+record.data.id);

    var blogContainer = this.getBlogContainer();
    blogContainer.setData(record.data);
    Ext.Viewport.animateActiveItem(blogContainer, this.slideLeftTransition);
}

});

到目前为止,一切都运行良好,但是,我不知道如何使用来自点击记录的新信息更新我的 blogContainer 中的所有组件?

我不能使用创建面板的简单概念,因为当点击博客时,我希望出现一个相当复杂的新容器......带有子组件等。

如何告诉这个新容器blog显示哪个详细信息,然后更新其信息?

4

1 回答 1

0

你可以试试这个。注释掉的行是如何访问数据并将其值设置为组件的另一个示例。

showBlog: function(view, record, item, index, e) {

    console.log('showing blog #'+index.data.id);

   // console.log('showing blog #'+index.data.example);

    var blogContainer = this.getBlogContainer();

    blogContainer.setData(index.data.id);

   // Ext.getCmp('idoftextfield').setValue(index.data.example);

    Ext.Viewport.animateActiveItem(blogContainer, this.slideLeftTransition);

希望有帮助

于 2012-05-16T04:45:57.337 回答