0

如何正确使用 MVVM 视图模型存储？

列表.js： 

Ext.define('some.List', {
    extend: 'Ext.tree.Panel',
    requires: [
        'some.ListModel'
    ],
    rootVisible : false,
    hideHeaders: true,
    viewModel: {
        type: 'list'
    },
    bind: {store:'{mlists}'},
    columns: [{
        xtype: 'treecolumn',
        dataIndex: 'name',
        flex: 1,
        sortable: false,
    }]
});

ListModel.js： 

Ext.define('some.ListModel', {
    extend: 'Ext.app.ViewModel',
    alias: 'viewmodel.list',
    requires: [
        'Ext.data.proxy.Ajax'
    ],
    stores: {
        mlists: {
            autoLoad: true,
            fields: [
                { name: 'id', type: 'int'},
                { name: 'name', type: 'string' },
                { name: 'count' },
                { name: 'group' }
            ],
            proxy: {
                type: 'ajax',
                api: {
                    read: 'php/lists/read.php'
                },
                reader: {
                    type: 'json',
                    rootProperty: 'lists'
                }
            }
        }
   }
});

我得到错误：

Uncaught TypeError: undefined is not a function Panel.js?_dc=1404313037482:430
Ext.define.bindStore                            Panel.js?_dc=1404313037482:430
Ext.define.reconfigure                          Table.js?_dc=1404313037482:1417
Ext.define.setStore                             Table.js?_dc=1404313037482:1376
Ext.define.privates.onBindNotify                Bindable.js?_dc=1404313037482:681
Ext.define.privates.notify                      BaseBinding.js?_dc=1404313037482:83
Ext.define.privates.react                       Binding.js?_dc=1404313037482:206
Ext.define.notify                               Scheduler.js?_dc=1404313037482:394
Ext.define.onTick                               Scheduler.js?_dc=1404313037482:425
(anonymous function)                            Function.js?_dc=1404313037482:121
4

1 回答 1

1

代码有几个问题：

  1. 如果它是Sencha Cmd生成的，那么查看 someList 应该在view目录中。当然，它在其他地方也可以使用，但必须有充分的理由不遵循 Sencha 推荐的目录结构。这与问题无关。
  2. Sencha 建议命名空间以大写字母开头，以区别于其他变量。它应该Some是 ，而不是some在这种情况下。它与问题无关。
  3. someList扩展TreePanel所以它必须使用一个TreeStore. mlists是普通店。这可能是问题的原因。

如果要在 ViewModel 中定义树存储，请使用type:'tree'config 选项对其进行配置，并且不要忘记配置root树存储所必需的选项。

然后，您可以按照您已经使用的方式将其正常绑定为任何其他商店。

于 2014-07-03T16:47:01.090 回答