5

サーバーから動的にロードされたコンテンツ(Jsonとして)とカスタムデータモデルを使用してツリーパネルを実装したいと思います。しかし、そのツリーのモデルとデータストアを定義する方法がわかりません。いくつか例を挙げていただけますか?可能であれば、sencha mvcの推奨事項(モデルとデータストアは別々のクラスとして定義されています)に準拠したいと思います。私はextjs3でそれを行う方法を知っていましたが、バージョン4では迷子になりました。

よろしくRG

4

2 に答える 2

14

最近、新しい MVC アプローチを試してみたところ、ツリーパネルでうまく機能するようになりました。実際には特別なことは何もありません:

意見:

Ext.define('RoleBuilder.view.RoleList', {
    extend: 'Ext.tree.Panel',
    alias: 'widget.roles',
    title: 'Roles',
    store: 'Roles'    
});

店:

Ext.define('RoleBuilder.store.Roles', {
    extend: 'Ext.data.TreeStore',
    model: 'RoleBuilder.model.Role',
    requires: 'RoleBuilder.model.Role',
    root: {
        text: 'Roles',
        expanded: true        
    },
    proxy: {
        type: 'ajax',
        url: loadRolesUrl,
        actionMethods: 'POST',
        reader: {
            type: 'json'
        }
    }
});

モデル:

Ext.define('RoleBuilder.model.Role', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'id', type: 'int', mapping: 'Id' },
        { name: 'text', type: 'string', mapping: 'Text' },
        { name: 'leaf', type: 'boolean', mapping: 'Leaf' },
        { name: 'loaded', type: 'boolean', mapping: 'Loaded', defaultValue: false },
        { name: 'Properties'},
        { name: 'expanded', defaultValue: true }
    ]
});

コントローラ:

Ext.define('RoleBuilder.controller.RoleList', {
    extend: 'Ext.app.Controller',
    init: function () {
        this.control({
            'roles': {
                itemcontextmenu: this.onItemContextMenuClick,
                itemclick: this.onItemClick
            }
        });

        this.application.on({
            'role-saved': Ext.Function.bind(this.onRoleSaved, this)
        });
    },
..... too long, but you got the idea.

それが役立つことを願っています。

于 2011-11-21T06:10:03.327 に答える