Javascript 有条件地将ViewModel绑定到树面板

我们在extjs中构建了一个管理系统，在这个系统中，我们有一个对话框，可以选择多个页面，保存选择并关闭对话框

我们已将同一组件“Ext.Tree.Panel”重新用于单个选择页面，此树不应具有复选框，并在单击时立即保存和关闭对话框。我们两棵树都在工作。。。但不是同时

我们确实为这两棵树创建了两个单独的视图模型。是否可以基于父存储的属性更改ViewModel

或者我们追求的是错误的方向，是否有更好的替代方案来使用具有不同行为的相同树组件。Thx&参见下面的元素代码

Selecttree.js

Ext.define('EurocampingsCMS.view.page.SelectTree', {
extend: 'Ext.tree.Panel',
alias: 'widget.page-select-tree',
requires: [
    'EurocampingsCMS.controller.page.SelectTree',
    'EurocampingsCMS.view.page.MultiSelectViewModel',
    'EurocampingsCMS.view.page.SingleSelectViewModel'
],
controller: 'page-select-tree',
viewModel: 'page.select',
loadMask: true,
rootVisible: false,
overflowY: true,
config: {
    rootId: null,
},
title: 'Pagina\'s',
hideHeaders: true,
animCollapse: true,
enableSort: false,
collapseFirst: false,
multiSelect: false,
border: 0,
listeners: {
    itemclick: 'onItemClick',
    afterrender: 'onGridAfterRender',
    reconfigure: 'onGridReconfigure'
},
bind: {
    store: '{pages}'
},
columns: [
    {
        xtype: 'treecolumn',
        dataIndex: 'name',
        flex: 2,
        editor: {
            xtype: 'textfield',
            selectOnFocus: true
        },
        renderer:  function(value, metaData, list, rowIndex, colIndex, store, view) {
            if (!list.get('active')) {
                return '<span class="inactive">' + value + '</span>';
            }
            return value;
        }
    }
]

}))

SingleSelectViewModel.js

Ext.define('EurocampingsCMS.view.page.MultiSelectViewModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.page.select',
requires: [
    'EurocampingsCMS.store.page.Select',
    'EurocampingsCMS.view.ViewModel'
],
config: {
    singleSelect: false,
},
stores: {
    pages: {
        type: 'page.select',
        autoLoad: true,
        checkedItems: '{checkedItems}',
        proxy: {
            extraParams: {
                locale: '{current.locale}'
            }
        },
    },
}

Ext.define('EurocampingsCMS.view.page.SingleSelectViewModel', {
extend: 'Ext.app.ViewModel',
alias: 'viewmodel.page.page',
requires: [
    'EurocampingsCMS.store.page.Select',
    'EurocampingsCMS.view.ViewModel'
],
config: {
    singleSelect: true,
},
stores: {
    pages: {
        type: 'page',
        autoLoad: true,
        proxy: {
            extraParams: {
                locale: '{current.locale}'
            }
        }
    },
}

}))