ExtJS6的中sencha cmd中自动创建案例项目代码分析

由上面的几个图片可以看到被显示的项目首页，实际上体现了ExtJS6.x中一些重要的概念比如，MVVM。
做几个实验吧

1.仅注释掉controller行：

结果就是new.js中的items中的项目的双击事件，无法触发了
只有“事件”没有被触发，但是数据都显示出来了
2.仅注释viewModel行

结果就是，什么都没有显示。这出乎意料，因为这与我们最初的认知很不一样。我最开始以为被显示的数据，一部分在new.js的items里面，另一部分在viewModel行对应的NewModel.js文件中。假如仅注释viewModel行，new.js中的代表左侧菜单栏中的数据,user乱七八糟的应该是被显示的。但是，结果是，全都不显示。下面是new.js中items中的代码：

3.不注释viewModel行，仅注释viewModel中对应文件中的数据


4.不使用alias，直接使用全限定名

5.修改app.js中主界面文件的名称

下面连同文件名一起修改

6.仅修改alias不修改文件名和全限定名

可以正常运行
7.修改alias和全限定名，不修改文件名

无法正常运行
8.alias、全限定名和文件名全都修改

可见，文件名和全限定名必须同时修改保持一致，才能正常找到文件。

下面我们看看List.js文件

如果在主界面中注释掉Home菜单项的xtype内容

继续看看List.js文件所代表的内容

直接看代码

/**
 * This view is an example list of people.
 */
Ext.define('SimpleCMS.view.main.List', {
    extend: 'Ext.grid.Panel',
    xtype: 'mainlist',

    requires: [
        'SimpleCMS.store.Personnel'
    ],

    title: 'Personnel',

    store: {
        type: 'personnel'
    },

    columns: [
        { text: 'Name',  dataIndex: 'name' },
        { text: 'Email', dataIndex: 'email', flex: 1 },
        { text: 'Phone', dataIndex: 'phone', flex: 1 }
    ],

    listeners: {
        select: 'onItemSelected'
    }
});

在此解释一下xtype是什么意思，xtype的意思就是“外号” 或者 "别名"
和类型没有任何关系，就是一个外号而已。

from https://yq.aliyun.com/articles/272335