我的ExtJS 5组件的ViewModel从祖先的ViewModels继承数据。
如何从子视图更新父视图的ViewModel数据？如果我尝试childPanel.getViewModel().set('myProp', 'foo');在childPanel ViewModel上创建myProp的新示例，而不是更新parentPanel的VM。使用myProp值的其他组件将不同于childPanel。
通过在子级上创建该本地myProp，当父级的myProp更改时，子级将不会随之更改，因为关系已断开。
我只需要myProp属性的一个示例，并且该值位于父级的ViewModel上。
为了解决这个问题，我的子虚拟机似乎必须知道属性是继承的还是本地存储的，这就要求子虚拟机知道应用程序的正确体系结构。它必须比我熟悉的更多地了解应用程序的体系结构，将子级与父级显著耦合。

示例显示子级创建新的panelTitle示例而不是更新父级示例：

https://fiddle.sencha.com/#fiddle/1e09
编辑：将按钮的点击事件移动到ViewController

Ext.application({
    name: 'Fiddle',

    launch: function() {

        Ext.define('ChildPanel', {
            extend: 'Ext.panel.Panel',
            alias: 'widget.childpanel',
            controller: 'childpanelcontroller',
            bind: {
                title: '{panelTitle}'
            },

            // first panel has its own viewmodel, which is a child of the viewport's VM
            viewModel: {
                data: {
                    'btnText': 'Click to Change Title'
                }
            },

            items: [{
                xtype: 'button',
                scale: 'large',
                bind: {
                    text: '{btnText}'
                },
                listeners: {
                    'click': 'onButtonClick'
                }
            }]
        });

        Ext.define('ChildPanelController', {
            extend: 'Ext.app.ViewController',
            alias: 'controller.childpanelcontroller',
            onButtonClick: function(btn) {
                // updates first panel's VM
                this.getViewModel().set('panelTitle', '<span style="color:red;">Now They Have Different Titles</span>');

                debugger;

                window.setTimeout(function() {

                    // by setting the first panel's VM instead of the viewport's, 
                    // the first panel will not use viewport's VM for `panelTitle` property again
                    btn.up('viewport').getViewModel().set('panelTitle', '<span style="color:green;">And Are No Longer Using the Same VM Data</span>');

                }, 500);
            }
        });

        Ext.create('Ext.container.Viewport', {
            viewModel: {
                data: {
                    'panelTitle': 'Both Have the Same Title'
                }
            },
            layout: 'hbox',
            items: [{
                xtype: 'childpanel',
                flex: 1
            }, {
                // second panel uses the viewport's viewmodel
                xtype: 'panel',
                bind: {
                    title: '{panelTitle}'
                },
                flex: 1,
                margin: '0 0 0 25px'
            }]
        });
    }
});