TreePanel: почему я должен использовать Ext.crete для инициализации магазина?

В определении панели дерева я хотел бы написать (как я обычно делаю с панелями сетки):

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":""}   
}
Источник

1 ответ

Если вы используете MVC, и вы перечислите магазин в stores:[] массив приложения или контроллера, то Ext создает хранилище для вас и регистрирует его в StoreManager, Затем вы можете использовать строку с storeId в панели дерева.

Например:

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

// in tree config
store:'MyStore'

работает.

Однако приведенный выше код обходит MVC, так что вам нужно явно создать хранилище с помощью Ext.create

Источник
Другие вопросы по тегам