Question

我正在尝试构建MVC应用程序。

以下是我的app / controller / project.js文件的代码

Ext.define('rt.controller.project', {
extend: 'Ext.app.Controller',

stores: ['project'],
models: ['project'] ,   
views: ['project.main', 'project.projectlist'],

refs: [
       {ref: 'projectList', selector: 'projectlist'},
       {ref: 'projectData', selector: 'projectlist dataview'}
       ],


init: function() {
    this.control({
        'projectlist dataview': {
            selectionchange: this.loadProject
        },
        'projectlist button[action=add]': {
            click: this.addProject
        },
        'projectlist button[action=remove]': {
            click: this.removeProject
        }
    });
},

onLaunch: function() {
    console.log(this.getProjectData());
    var dataview = this.getProjectData(),
        store = this.getProjectStore();
     console.log("Stoer = " + store);   
    dataview.bindStore(store);
    dataview.getSelectionModel().select(store.getAt(0));

},


loadProject: function(selModel, selected) {

    console.log("Load Project");

},


addProject: function() {
    console.log("Add Project");
},

removeProject: function() {
    console.log("Remove Project");
},


});

以下是我的app / view / project / projectlist.js的代码

Ext.define('rt.view.project.projectlist', {
extend: 'Ext.panel.Panel',
alias: 'widget.projectlist',

requires: ['Ext.toolbar.Toolbar'],

title: 'Projects',
collapsible: true,
animCollapse: true,
margins: '5 0 5 5',
layout: 'fit',

initComponent: function() {
    Ext.apply(this, {
        items: [{
            xtype: 'dataview',
            trackOver: true,
            store: this.store,
            cls: 'project-list',
            itemSelector: '.project-list-item',
            overItemCls: 'project-list-item-hover',
            tpl: '<tpl for="."><div class="project-list-item">{name}</div></tpl>',
            listeners: {
                selectionchange: this.onSelectionChange,
                scope: this
            }
        }],

        dockedItems: [{
            xtype: 'toolbar',
            items: [{
                text: 'Add project',
                action: 'add'
            }, {
                text: 'Remove project',
                disabled: true,
                action: 'remove'
            }]
        }]
    });

    this.callParent(arguments);
},

onSelectionChange: function(selmodel, selection) {
    var selected = selection[0],
        button = this.down('button[action=remove]');
    if (selected) {
        button.enable();
    }
    else {
        button.disable();
    }
}
});

当我运行我的应用时，它显示以下错误

数据视图未定义

位于第34行的文件controller / project.js中

dataview.bindStore(store);

以下似乎无法在控制器代码中使用

refs: [
    {ref: 'projectList', selector: 'projectlist'},
    {ref: 'projectData', selector: 'projectlist dataview'}
],

是否有人知道可能导致这种情况的原因？

如果您需要更多信息，请与我们联系。

Answer 1

我有类似的问题引用dataview。以下是我修改选择器字符串的方法：

{ref: 'projectData', selector: 'projectlist > dataview' }

那应该解决它。但是我想问一下onLaunch方法在控制台上显示的console.log(this.getProjectData());是什么？另外，我没有看到projectStore的ref，因此您可以执行命令：

store = this.getProjectStore();

您是否错过了projectStore列表中的refs引用？

ref不在extjs4 mvc应用程序的控制器中工作

1 个答案: