Question

我们如何使用ExtJs MVVM模式扩展视图？扩展视图控制器绑定到它的视图的正确方法是什么？

我有一个带有viewcontroller的基本视图，我想扩展它，就像this fiddle一样。

问题是在扩展视图中不再可以访问基本视图控制器中定义的方法。 ExtJs只在扩展的viewcontroller中查找要调用的方法。

Ext.define('Fiddle.view.Base', {
    extend: 'Ext.panel.Panel',
    requires: [
        'Fiddle.view.BaseController'
    ],
    controller: 'base',
    tbar: [{
        text: 'Base button',
        handler: 'onBaseMethod'
    }]
})

Ext.define('Fiddle.view.BaseController', {
    extend: 'Ext.app.ViewController',
    alias: 'controller.base',
    onBaseMethod: function(me){
        Ext.Msg.alert('Base', 'Base method')
    }
})

Ext.define('Fiddle.view.Extended', {
    extend: 'Fiddle.view.Base',
    requires: ['Fiddle.view.ExtendedController'],
    controller: 'extended',
    title: 'Viewcontroller inheritance',
    bodyPadding: 5,
    html: 'The Base button does not work, because the method is searched in ExtendedController only.',
    bbar: [{
        text: 'Extended button',
        handler: 'onExtendedMethod'
    }]
})

Ext.define('Fiddle.view.ExtendedController', {
    extend: 'Ext.app.ViewController',
    alias: 'controller.extended',
    onExtendedMethod: function(me){
        Ext.Msg.alert('Extended', 'Extended method')
    },
    renderTo: Ext.getBody()
})

Answer 1

你可以简单地扩展＆＃39; Fiddle.view.BaseController＆＃39;使用onExtendedMethod方法。请参阅小提琴https://fiddle.sencha.com/#fiddle/20m3

明确：只需替换

Ext.define('Fiddle.view.ExtendedController', {
    extend: 'Ext.app.ViewController',

带

Ext.define('Fiddle.view.ExtendedController', {
    extend: 'Fiddle.view.BaseController',

具有视图和视图控制器之间继承的MVVM

1 个答案: