Question

下面是我需要在extjs6的treeview面板中显示的json formate 从服务器加载存储后，我无法在树面板中看到任何记录。什么应该是这个json渲染到树视图面板的模型视图和存储。谢谢。这是我的代码：

型号：

 Ext.define('File', {
        extend: 'Ext.data.TreeModel',
        fields: [
                    {number: 'number',     type: 'string'},
        ]
    });

商店：

var store = Ext.create('Ext.data.TreeStore', {
        model: 'File',
        proxy: {
            type: 'ajax',
            url: 'component-tree.json',

            reader: {
                type: 'json',
                rootProperty: 'components',

                leaf: true,
                children: 'components',
                expanded: true,

            },

        },

        folderSort: true,
    });

查看：

var tree = Ext.create('Ext.tree.Panel', {
        autoLoad: true,
        collapsible: true,
        useArrows: true,
        rootVisible: true,
        store: store,
        multiSelect: true,
        width: 250,
        height: 300,
        viewConfig: {
            plugins: {
                ptype: 'treeviewdragdrop',
                appendOnly: true
            }
        },
        root: {
            text: "Components",
            expanded: true,

        },



        renderTo: document.body
    });

component-tree.json：

{
    "components": {
        "state": "RELEASED",
        "nodeType": "Component",
        "checked": true,
        "name": "PLATE - FOR CABINET - ASSEMBLY",
        "level": 0,
        "url": "http://example.com/Windchill/servlet/nexiles/tools/api/1.0/epmdocuments/OR:wt.epm.EPMDocument:4474031",
        "oid": "OR:wt.epm.EPMDocument:4474031",
        "modified": "17.04.2015",
        "filename": "21378386.asm",
        "num_children": 7,
        "number": "21378386.ASM",
        "details": "http://example.com/Windchill/app/#ptc1/tcomp/infoPage?oid=OR:wt.epm.EPMDocument:4474031&u8=1",
        "components": [
            {
                "nodeType": "Component",
                "leaf": true,
                "name": "PLATE - FOR CABINET - DETAIL",
                "level": 1,
                "url": "http://example.com/Windchill/servlet/nexiles/tools/api/1.0/epmdocuments/OR:wt.epm.EPMDocument:4474018",
                "oid": "OR:wt.epm.EPMDocument:4474018",
                "modified": "17.04.2011",
                "filename": "1234.prt",
                "state": "RELEASED",
                "number": "21378385.PRT",
                "details": "http://example.com/Windchill/app/#ptc1/tcomp/infoPage?oid=OR:wt.epm.EPMDocument:4474018&u8=1",
                "version": "A",
                "checked": true,
                "drawings": [
                    {
                        "reftype": "DRAWING",
                        "nodeType": "Drawing",
                        "leaf": true,
                        "name": "PLATE - FOR CABINET - DETAIL",
                        "url": "http://example.com/Windchill/servlet/nexiles/tools/api/1.0/epmdocuments/OR:wt.epm.EPMDocument:4474013",
                        "oid": "OR:wt.epm.EPMDocument:4474013",
                        "modified": "17.04.2015",
                        "filename": "21378385.drw",
                        "source": "representation",
                        "state": "RELEASED",
                        "number": "21378385.DRW",
                        "details": "http://example.com/Windchill/app/#ptc1/tcomp/infoPage?oid=OR:wt.epm.EPMDocument:4474013&u8=1",
                        "version": "A",
                        "checked": true,
                        "id": "OR:wt.epm.EPMDocument:4474013-DRAWING",
                        "icon": "/resources/images/drawing.gif"
                    },
                    {
                        "reftype": "INTERNAL",
                        "nodeType": "Drawing",
                        "leaf": true,
                        "name": "PLATE - FOR CABINET - ASSEMBLY",
                        "url": "http://example.com/Windchill/servlet/nexiles/tools/api/1.0/epmdocuments/OR:wt.epm.EPMDocument:4474041",
                        "oid": "OR:wt.epm.EPMDocument:4474041",
                        "modified": "17.04.2015",
                        "filename": "21378386.drw",
                        "source": "representation",
                        "state": "RELEASED",
                        "number": "21378386.DRW",
                        "details": "http://example.com/Windchill/app/#ptc1/tcomp/infoPage?oid=OR:wt.epm.EPMDocument:4474041&u8=1",
                        "version": "A",
                        "checked": true,
                        "id": "OR:wt.epm.EPMDocument:4474041-INTERNAL",
                        "icon": "/resources/images/drawing.gif"
                    }
                ],
                "icon": "/resources/images/prt_image.gif"
            }
}

Answer 1

您的treeModel只定义number，但您的商店实际上包含更多字段......
有关详情，请参阅“异构节点类型”一章中的the doc。
在json文件中尝试使用children而不是components。顺便说一下，我可以说配置root: { text: "Components", ... }和json内容"components": [ ... ]之间的情况没有得到尊重。
C和c

树视图面板

1 个答案: