Sencha Touch 2中2级详细视图导航的第一个详细视图中的listview未触发Itemtap

我有一个分类页面，可以深入到零售商列表，然后再深入到零售商详细信息页面。当我点击某个类别时，我会看到该类别的零售商列表。然后，我可以点击任何零售商，查看其详细信息。我可以查看详细信息，返回并查看其他零售商的详细信息。但是，如果我返回类别列表，然后单击另一个类别，然后获取零售商列表，我将无法单击零售商查看零售商详细信息页面。我不知道为什么这不起作用，或者我是否使用了最佳的方式来传递这些数据

处理事件的我的控制器：

Ext.define('MyApp.controller.Retailers', {
    extend: 'Ext.app.Controller',


    config: {
        refs: {
            retailersView: 'retailersView',
            categoriesView: 'categoriesView',
            categoryList: '#categoryList',
            retailerList: '#retailerList',
        },


        control: {
            categoryList: {
                itemtap: 'onCategoryItemTap',
                disclose: 'onCategoryDisclose'
            },
            retailerList: {
                itemtap: 'onRetailerItemTap',
                disclose: 'onRetailerDisclose'
            }
        }
    },


    onCategoryItemTap: function (list, index, target, record, e) {
        this.showRetailerList(list, record);
    },


    onCategoryDisclose: function(list, record) {
        this.showRetailerList(list, record);
    },


    showRetailerList: function(item, record) {
        var retailersByCategory = Ext.getStore('retailersStore');
        retailersByCategory.clearFilter();
        retailersByCategory.filter('category_id', record.data.id);
        this.getCategoriesView().push({
            xtype: 'retailersView',
            data: retailersByCategory
        });
    },


    onRetailerItemTap: function (list, index, target, record, e) {
        console.log('itemtap fired!');
        this.showRetailerDetail(list, record);
    },


    onRetailerDisclose: function(list, record) {
        console.log('disclose fired!');
        this.showRetailerDetail(list, record);
    },


    showRetailerDetail: function(item, record) {
        var offersForRetailer = Ext.getStore('offersStore');
        offersForRetailer.clearFilter();
        offersForRetailer.filter('retailer_id', record.data.id);
        record.data.offersStore = offersForRetailer;
        item.up('navigationview').push({
            xtype: 'retailerDetail',
            data: record.data
        });
    }


});

我的类别页面：

Ext.define('MyApp.view.Categories', {
    extend: 'Ext.navigation.View',
    xtype: 'categoriesView',


    requires: [
        'MyApp.store.Categories',
        'Ext.List',
        'Ext.field.Search'
    ],


    config: {
        navigationBar: {
            items: [
                {
                    xtype: 'button',
                    text: 'Help',
                    id: 'categoriesHelp',
                    align: 'right'
                }
            ]
        },
        items: [
            {
                xtype: 'container',
                //title: 'Retailers',
                layout: {
                    type: 'vbox'
                },
                items: [
                    {
                        xtype: 'listView',
                        ui: 'round',
                        id: 'categoryList',
                        store: 'Categories',
                        itemTpl: '{name}'
                    }
                ]
            }
        ]


    },


    initialize: function() {
        this.callParent();

    }

});

我的零售商页面：

Ext.define('MyApp.view.Retailers', {
    extend: 'Ext.Container',
    xtype: 'retailersView',


    requires: [
        'MyApp.store.Retailers',
        'Ext.List',
        'Ext.field.Search'
    ],


    config: {
        layout: {
            type: 'vbox'
        },
        scrollable: {
            direction: 'vertical',
            directionLock: true
        },
        items: [
            {
                xtype: 'listView',
                id: 'retailerList',
                itemTpl: [
                    '<div class="listingImage">',
                        '<img width="80" height="80" src="{imgUrl}" />',
                    '</div>',
                    '<div>',
                        '<span class="listingName">{name}</span>',
                    '</div>',
                    '<div>',
                        '<tpl if="total_offers &gt; 0">',
                        '<span class="listingOffers">{total_offers} offers</span>',
                        '</tpl>',
                        '<span class="listingDistance">{distance} km</span>',
                    '</div>'
                ].join(''),
                flex: 1
            }
        ]
    },


    initialize: function() {
        this.callParent();
        console.log(this.config.data.data.length + ' retailers in this category');
        this.down('#retailerList').setStore(this.config.data);
    }

});

Ext.define（'MyApp.view.Retailers'{
扩展：“Ext.Container”，
xtype:“RetailerView”，
要求：[
“MyApp.store.Retailers”，
“外部列表”，
“Ext.field.Search”
],
配置：{
布局：{
类型：“vbox”
},
可滚动：{
方向：'垂直'，
方向锁：正确
},
项目：[
{
xtype:“listView”，
id:“零售商列表”，
第三方物流：[
'',
'',
'',
'',
“{name}”，
'',
'',
'',
“{total_offers}offers”，
'',
“{distance}km”，
''
].加入（“”），
弹性：1
}
]
},
初始化：函数（）{
这是callParent（）；
log（this.config.data.data.length+“此类别中的零售商”）；
this.down（“#retailerList”）.setStore（this.config.data）；
}
});

我的零售商详细信息页面：

Ext.define('MyApp.view.detail.Retailer', {
    extend: 'Ext.Container',
    xtype: 'retailerDetail',


    requires: [
        'Ext.dataview.List',
        'Ext.SegmentedButton',
        'Ext.Img'
    ],


    config: {
        scrollable: {
            direction: 'vertical',
            directionLock: true
        },
        layout: 'vbox',
        items: [
            {
                xtype: 'container',
                id: 'retailerBasicDetail',
                flex: 1,
                items: [
                    {
                        xtype: 'container',
                        cls: 'retailer-detail-container',
                        items: [
                            {
                                xtype: 'container',
                                layout: 'hbox',
                                flex: 1,
                                items: [
                                    {
                                        xtype: 'container',
                                        id: 'offer-detail-image-container',
                                        items: [
                                            {
                                                xtype: 'img',
                                                cls: 'offerDetailImg',
                                                id: 'retailerImg'
                                            }
                                        ]
                                    },
                                    {
                                        xtype: 'container',
                                        layout: 'vbox',
                                        items: [
                                            {
                                                xtype: 'container',
                                                id: 'retailer-detail-basic',
                                                flex: 1,
                                                tpl: [
                                                    '<div class="offer-detail-name">',
                                                        '<h3>{name}</h3>',
                                                    '</div>',
                                                    '<div class="offer-detail-distance">',
                                                        '<span>Nearest location: {distance} km</span>',
                                                    '</div>'
                                                ].join('')
                                            },
                                            {
                                                xtype: 'container',
                                                cls: 'offer-detail-actions',
                                                layout: 'hbox',
                                                flex: 1,
                                                items: [
                                                    {
                                                        xtype: 'button',
                                                        cls: 'retailer-detail-contact-button',
                                                        id: 'retailer-detail-contact-button'
                                                    },
                                                    {
                                                        xtype: 'button',
                                                        cls: 'retailer-detail-map-button',
                                                        id: 'retailer-detail-map-button'
                                                    }
                                                ]
                                            }
                                        ]

                                    }
                                ]
                            },
                            {
                                xtype: 'container',
                                flex: 1,
                                id: 'retailer-detail-description',
                                tpl: [
                                    '<div class="retailer-detail-about">',
                                        '<p>{description}</p>',
                                    '</div>'
                                ].join('')
                            }
                        ]
                    }

                ]
            },
            {
                xtype: 'list',
                id: 'retailerOffersList',
                scrollable: 'false',
                flex: 1,
                ui: 'round',
                itemTpl: '<strong>{offer}</strong>',
                onItemDisclosure: true
            }
        ]
    },


    initialize: function() {
        this.callParent();
        this.down('#retailerImg').setSrc(this.config.data.imgUrl);
        this.down('#retailer-detail-description').setData(this.config.data);
        this.down('#retailer-detail-basic').setData(this.config.data);
        this.down('#retailerBasicDetail').setData(this.config.data);


        var offersForRetailer = Ext.getStore('offersStore');
        offersForRetailer.clearFilter();
        offersForRetailer.filter('retailer_id', this.config.data.id);
        this.down('#retailerOffersList').setStore(offersForRetailer);
    }    
});

Ext.define（'MyApp.view.detail.Retailer'）{
扩展：“Ext.Container”，
xtype:'retailerDetail'，
要求：[
“Ext.dataview.List”，
“Ext.SegmentedButton”，
“Ext.Img”
],
配置：{
可滚动：{
方向：'垂直'，
方向锁：正确
},
布局：“vbox”，
项目：[
{
xtype:'容器'，
id:“详细信息”，
弹性：1，
项目：[
{
xtype:'容器'，
cls:“零售商详细信息容器”，
项目：[
{
xtype:'容器'，
布局：“hbox”，
弹性：1，
项目：[
{
xtype:'容器'，
id:“提供详细信息图像容器”，
项目：[
{
xtype:'img'，
cls:“offerDetailImg”，
id:'retailerImg'
}
]
},
{
xtype:'容器'，
布局：“vbox”，
项目：[
{
xtype:'容器'，
id:“零售商详细信息基本”，
弹性：1，
第三方物流：[
'',
“{name}”，
'',
'',
'最近位置：{distance}km'，
''
].加入（“”）
},
{
xtype:'容器'，
cls:“提供详细行动”，
布局：“hbox”，
弹性：1，
项目：[
{
xtype:'按钮'，
cls:“零售商详细联系按钮”，
id:“零售商详细信息联系人按钮”
},
{
xtype:'按钮'，
cls:“零售商详细信息地图按钮”，
id:“零售商详细信息地图按钮”
}
]
}
]
}
]
},
{
xtype:'容器'，
弹性：1，
id:“零售商详细说明”，