首页 > 解决方案 > 如何在 extJS 数据存储中显示图像

问题描述

如何在 extJS 数据存储中显示图像。

我需要在我的应用程序中使用拖放功能。为此,我正在使用树形面板并为此存储。通过这样做,我能够以所需的格式加载带有商店的树。现在加载 tis 数据是否可以加载图像。

为此,我需要将图像存储在树店中。这导致质疑如何在 extJS 商店的树形面板中加载图像。

这是我的树面板。

{
            xtype: 'treepanel',
            cls : 'myCls',
            align: 'stretch',
            rootVisible : false,
           height: window.innerHeight - 80,
            useArrows: true,
            hideHeaders: true,
            scrollable: true,
            autoScroll: true,
            copy: true,
            rootVisible: false,
            viewConfig: {
                plugins: {
                    ddGroup: 'grid-to-form',
                    ptype: 'treeviewdragdrop',
                    appendOnly: true,
                    sortOnDrop: true,
                    enableDrag: true,
                    containerScroll: true,
                    allowParentInsert: false,
                    allowContainerDrops: false
                }
            },
            
            store: Ext.create('Ext.data.TreeStore', {
                root: {
                    expanded: true,
                    "text": ".",
                    "children": [{
                        "item": "Combo Box",
                        "type": "combobox",
                        "label": "Combo Box",
                        "labelPosition": "left",
                        "keyfield" : "value",
                        "valuefield" : "value",
                        "data" : [{"value" : "Select"},{"value" : "Item 1"},{"value" : "Item2"}],
                        "defaultValue": "Select",
                        "width": 300,
                        "name": "customerType",
                        "leaf": true,
                        "iconCls": "tree-grid-task"
                    },
                    {
                        "item": "Date",
                        "type": "datefield",
                        "name": "datefield",
                        "label": "Date",
                        "labelPosition": "left",
                        "defaultValue": "",
                        "width": 300,
                        "emptyText": "",
                        "leaf": true,
                        "iconCls": "tree-grid-task"
                    },
                    
                    {
                        "item": "Text Area",
                        "type": "textarea",
                        "name": "textarea",
                        "label": "Text Area",
                        "labelPosition": "left",
                        "defaultValue": "",
                        "width": 300,
                        "emptyText": "",
                        "cls":"formgen-textarea",
                        "leaf": true,
                        "iconCls": "tree-grid-task"
                    }]
                }
            }),
            columns: [{
                xtype: 'treecolumn',
                text: '',
                dataIndex: 'item',

                flex: 2,
                sortable: true
            }]
        }

标签: javascriptextjsextjs6

解决方案


推荐阅读