ExtJS 5:当更改单个存储时，所有存储都会更新

我创建了一个选项卡面板，以图像为标题，以html为自定义组件。这些自定义组件使用存储，但我在更新单个变量（状态）时出错，所有变量都会更改。在这里我显示代码：

SelectableButtons组件：

Ext.require('Cat3.view.fsm.data.ButtonsStore');
/**
 * Selectable button with image
 */
Ext.define('Cat3.view.fsm.components.SelectableButtons', {
    extend: 'Ext.view.View',
    cls: 'selectable-buttons',
    alias: 'widget.selectable-buttons',
    tpl: [
        '<tpl for=".">',
            '<div class="thumb-wrap button button-{status}">',
                '<img src="resources/images/cards/{type}/{status}/{name}.png">',
                '<img src="resources/images/icons/icon_mandatory.png" class="button-tick button-tick-{status}">',
            '</div>',
        '</tpl>'
    ],
    // Set both to false if you want single select
    multiSelect: true,
    simpleSelect: true,
    trackOver: false,
    itemSelector: 'div.thumb-wrap',
    listeners: {
        select: function(ths, record, eOpts) {
            record.set('status', 'active');
            debugAmenaButtonStatus(this);
        },
        deselect: function(ths, record, eOpts) {
            record.set('status', 'passive');
        },
        selectionchange: function(selection) {
            this.refresh();
        },
        containerclick: function(ths, e, eOpts) {
            return false; // Stops the deselection of items
        }
    },
    initComponent: function() {
        var store = Ext.create('Cat3.view.fsm.data.ButtonsStore');
        this.setStore(store);
        this.callParent(arguments);
    }
});

debugAmenaButtonStatus = function(ref) {
    ref.up().up().items.items.forEach(function(tab) { // Tab
        console.log(tab.items.items[0].getStore().data.items[0].data.status); // Amena Button Status
    });
};

可选择按钮旋转木马组件（选项卡面板）。它使用另一个商店，但没有关联：

var cardsImagePath = 'resources/images/cards/';
var ImageModel = Ext.define('ImageModel2', {
    extend: 'Ext.data.Model',
    fields: [{
        name: 'name',
        type: 'string'
    }, {
        name: 'type',
        type: 'string'
    }, {
        name: 'status',
        type: 'string'
    }, ]
});
var store = Ext.create('Ext.data.Store', {
    model: 'ImageModel2',
    data: [{
        name: 'amena',
        type: 'operator',
    }, {
        name: 'movistar',
        type: 'operator',
    }, {
        name: 'orange',
        type: 'operator',
    }, {
        name: 'simyo',
        type: 'operator',
    }, {
        name: 'yoigo',
        type: 'operator',
    }, {
        name: 'vodafone',
        type: 'operator',
    }]
});

Ext.define('Cat3.view.fsm.components.SelectableButtonsCarousel', {
    extend: 'Ext.tab.Panel',
    xtype: 'basic-tabs',
    cls: 'selectable-buttons-carousel',
    alias: 'widget.selectable-buttons-carousel',
    store: store,
    resizeTabs: false,
    defaults: {
        bodyPadding: 10,
        layout: 'fit'
    },

    require: [
      'Cat3.view.fsm.components.SelectableButtons',
      'Cat3.view.fsm.data.ButtonsStore'
    ],
    titleTpl: function(info) {
        return '<img src="resources/images/cards/operator/' +  info.status + '/' + info.name + '.png">';
    },
    listeners: {
        render: function(p) {
            var tabpanel = this;
            this.store.data.items.forEach(function(item, index) {
                item.data.status = index === 0 ? 'active' : 'passive';
                var buttons = new Cat3.view.fsm.components.SelectableButtons();
                tabpanel.add(Ext.create('Ext.Panel', {
                    id: 'tab-' + index,
                    title: tabpanel.titleTpl(item.data),
                    items: [ buttons ],
                    cls: item.data.status,
                    info: item.data,
                    listeners: {
                        render: function(p) {
                            console.log('render');
                        }
                    }
                }));
            });
            tabpanel.setActiveTab(0);
        },
        tabchange: function(tabPanel, newCard, oldCard, eOpts) {
            newCard.info.status = 'active';
            newCard.setTitle(this.titleTpl(newCard.info));
            newCard.items.items[0].refresh();
            if (oldCard) {
                oldCard.info.status = 'passive';
                oldCard.setTitle(this.titleTpl(oldCard.info));
            }
        }
    }
});

可选按钮存储：

var ImageModel = Ext.define('ImageModel', {
    extend: 'Ext.data.Model',
    fields: [
       {name: 'name', type: 'string'},
       {name: 'type', type: 'string'},
       {name: 'status', type: 'string'},
    ]
});
Ext.define('Cat3.view.fsm.data.ButtonsStore', {
    extend: 'Ext.data.Store',
    model: 'ImageModel',
    data: [
        {name: 'amena', type: 'operator', status: 'passive'},
        {name: 'movistar', type: 'operator', status: 'passive'},
        {name: 'orange', type: 'operator', status: 'passive'},
        {name: 'simyo', type: 'operator', status: 'passive'},
        {name: 'yoigo', type: 'operator', status: 'passive'},
        {name: 'vodafone', type: 'operator', status: 'passive'}
    ],
    listeners: {
        datachanged: function() {
            console.log('store data changed');
        }
    }
});

所有操作都很好，但当我选择SelectableButtons（一个选项卡）中的一个按钮时，每个选项卡的同一按钮都会更改其状态，并且只有活动选项卡中选定的一个必须更改。有什么想法吗？我已经检查了每个商店是单独创建的，并且每个商店都有不同的id。