SenchaTouch2 - 侦听商店加载事件,设置选项卡面板项“徽章文本”

SenchaTouch2 - Listening to store load event, set tab panel item "badgeText"

本文关键字:徽章 徽章文本 文本 选项 设置 事件 加载 SenchaTouch2      更新时间:2023-09-26

我正在尝试构建我的第一个小Sencha Touch 2应用程序。我已经创建了一些按预期工作的东西,现在我想创建一些事件处理的东西。

我创建了以下商店:

Ext.define('Mobile.store.Blogs', {
    extend: 'Ext.data.Store',
    config: {
    },
    listeners: {
        'load' :  function(store,records,options) {
            store.loaded = true;
            console.log("fired blogCountAvailable");
            store.fireEvent("blogCountAvailable");
        },
        'blogCountAvailable': function(store, records, options) {
            console.log("blogCountAvailable has been fired");
        }
    }
});

这些东西按预期工作,但现在是下一步。

这是我的选项卡面板栏的代码:

    Ext.create("Ext.tab.Panel", {
        xtype:'mainTabPanelBottom',
        tabBarPosition: 'bottom',
        fullscreen: true,
    items: [
            {
                title: 'Blog',
                iconCls: 'home',
                xtype:'mainpanel'
            },
            {
                title: 'Users',
                iconCls: 'user',
                xtype:'userpanel'
            }
    ],
        listeners: {
            blogCountAvailable: function(tabpanel, newTab) {
                var tab   = newTab.tab,
                            badge = 10;
                tab.setBadge(badge);
                console.log("blogCountAvailable has been fired");
            }
        }
    });

我现在的问题是,我如何实现它以blogCountAvailable选项卡面板"触发"我的自定义事件?

最简单的方法是为TabPanel设置一个id,然后:

Ext.getCmp('your_TabPanel_id').fireEvent("blogCountAvailable");