Question

在树面板定义上，我想写（就像我通常使用网格面板一样）：

store: 'MyStore'

但它仅适用于

store: Ext.create('MyStore')

在第一种情况下，我在丢失商店时出错。只有第二种选择似乎有效。这给了我很多MVC设计的麻烦，我想避免。我的问题是：有没有办法在第一个选项中设置商店？它看起来很奇怪，因为对于网格面板，这个商店分配正常工作。

这里是完整的代码：

<html>
<head>

    <link rel="stylesheet" type="text/css" href="ext/packages/ext-theme-classic/build/resources/ext-theme-classic-all.css" />
    <script type="text/javascript" src="ext/ext-all-debug.js"></script>
</head>
<body>

    <script type="text/javascript">
        Ext.onReady(function () {

            try {

                //define model
                Ext.define('MyDataModel', {
                    extend: 'Ext.data.Model',

                    fields: [
                        { name: 'nodename', mapping: 'nodename' }
                    ],

                });

                //define store
                Ext.define('MyStore', {
                    extend: 'Ext.data.TreeStore',

                    storeId: 'idStoreLryManager',
                    model: 'MyDataModel',

                    root: {
                        nodename: 'myRoot',
                        expanded: true
                    },

                    proxy: {
                        type: 'ajax',
                        url: 'test_lrymgr.json',
                        reader: {
                            type: 'json',
                            root: 'data',
                            metaProperty: 'metadata',
                            totalProperty: 'metadata.totalCount',
                            successProperty: 'metadata.success',
                            messageProperty: 'metadata.msg'
                        },
                    }
                });

                //define tree panel
                Ext.define('MyTreePanel', {
                    extend: 'Ext.tree.Panel',
                    alias: 'widget.myTreePanel',

                    store: Ext.create('MyStore'),

                    rootVisible: true,

                    columns: [
                        {
                            xtype: 'treecolumn',
                            dataIndex: 'nodename',
                            sortable: false,
                            flex: 2,
                            header: ''
                        }
                    ]
                });


                //create tree view
                Ext.createWidget('window', {
                    title: 'test',
                    layout: 'fit',
                    autoShow: true,
                    height: 360,
                    width: 200,
                    items: {
                        xtype: 'myTreePanel',
                        border: false
                    }
                });

            }
            catch (ex) {
                Ext.Msg.alert("", ex)
            }
        });



    </script>
</body>
</html>

这里是json：

{   
    "data": [   
        {
            "nodename": "AAA",
            "isvisible": true,
            "expanded": false,
            "leaf": false,
            "data": [
                {
                    "nodename": "BBB.1",
                    "isvisible": true,
                    "expanded": false,
                    "leaf": true
                },              
                {
                    "nodename": "BBB.2",
                    "isvisible": false,
                    "expanded": false,
                    "leaf": true
                }
            ]          
        },
        {
            "nodename": "BBB",
            "isvisible": true,
            "expanded": false,
            "leaf": true
        }           
    ],
    "metadata": { "success":true, "msg":"", "totalCount":1, "totalPages":1, "prevLink":"", "nextLink":""}   
}

Answer 1

如果您使用MVC并在应用程序或控制器的stores:[]数组中列出商店，则Ext会为您创建商店并在StoreManager中注册它。然后，您可以在树状面板中使用带有storeId的字符串。

例如：

// in Application.js
stores:['MyStore']

// in tree config
store:'MyStore'

作品。

但是，上面的代码会绕过MVC，因此您必须使用Ext.create

明确创建商店

TreePanel：为什么我必须使用Ext.crete初始化存储？

1 个答案: