[英]dijit.Tree Folders appear with a icon PLUS even if no children are present
[英]Tree node with expandable property set to true and no children does not render plus icon
可扩展属性设置为true并且没有子级的树节点不会呈现扩展/折叠图标。
我需要开发仅按需加载子节点的树控件。 换句话说,应在子节点展开事件上加载子级。 我发现,将属性“ expandable”设置为true时,无论是否存在子代,都应该呈现扩展/折叠图标。 您能否检查一下我的代码并指出我错误地认为“展开/折叠图标”仅针对具有子节点的渲染。
具有存储和模型的树声明如下:
Ext.define('Entity', {
extend: 'Ext.data.Model',
fields: [
{name: 'name', type: 'string'},
{name: 'description', type: 'string'},
{name: 'clazz', type: 'string'},
{name: 'path;', type: 'string'},
{name: 'leaf', type: 'boolean'},
{name: 'expandable',type: 'boolean'},
{name: 'allowChildren', type: 'boolean'}
]
});
var mpsStore = Ext.create('Ext.data.TreeStore', {
model: 'Entity',
proxy: {
type: 'ajax',
url: 'companyTree'
}
,root: {
name: '__ROOT__'
}
});
Ext.define('App.view.Navigation', {
extend: 'Ext.tree.Panel',
alias : 'widget.Navigation',
title: '...',
rootVisible: false,
lines: false,
useArrows: true,
store: mpsStore
,columns: [{xtype: 'treecolumn',
text: 'Business Entity',
width: 150,
dataIndex: 'name',
},{ text: 'Description',
dataIndex: 'description'
}
]
});
响应json看起来像:
{
"path":".",
"id":"__ROOT__",
"name":"__ROOT__",
"user":null,
"description":null,
"clazz":null,
"iconCls":null,
"leaf":false,
"expanded":true,
"expandable":true,
"allowChildren":true,
"children":[
{
"path":".\\1",
"id":"1",
"name":"Company 1",
"user":null,
"description":null,
"clazz":"companyViewId",
"iconCls":"icon-organisation",
"leaf":false,
"expanded":false,
"expandable":true,
"allowChildren":true,
"children":[ ]
},
{
"path":".\\2",
"id":"2",
"name":"Company 2",
"user":null,
"description":null,
"clazz":"companyViewId",
"iconCls":"icon-organisation",
"leaf":false,
"expanded":false,
"expandable":true,
"allowChildren":true,
"children":[
{
"path":".\\2\\3",
"id":"3",
"name":"billTo 2.1",
"user":null,
"description":"2.1. Street Ave, unit 2.1",
"clazz":"billToViewId",
"iconCls":"icon-billto",
"leaf":false,
"expanded":false,
"expandable":true,
"allowChildren":true,
"children":[
{
"path":".\\2\\3\\4",
"id":"4",
"name":"shipTo 2.1.1",
"user":null,
"description":"2.1. Street Ave, unit 2.1",
"clazz":"shipToViewId",
"iconCls":"icon-shipto",
"leaf":false,
"expanded":false,
"expandable":true,
"allowChildren":true,
"children":[
{
"path":".\\2\\3\\4\\5",
"id":"5",
"name":"machine2.1.1.1",
"user":null,
"description":"manufacturer, model",
"clazz":"machineViewId",
"iconCls":"icon-machine",
"leaf":false,
"expanded":false,
"expandable":true,
"allowChildren":true,
"children":[ ]
}
]
},
{
"path":".\\2\\3\\6",
"id":"6",
"name":"shipTo 2.1.2",
"user":null,
"description":"2.1. Street Ave, unit 2.1",
"clazz":"shipToViewId",
"iconCls":"icon-shipto",
"leaf":false,
"expanded":false,
"expandable":true,
"allowChildren":true,
"children":[ ]
}
]
}
]
},
{
"path":".\\7",
"id":"7",
"name":"Company 3",
"user":null,
"description":null,
"clazz":"companyViewId",
"iconCls":"icon-organisation",
"leaf":false,
"expanded":false,
"expandable":true,
"allowChildren":true,
"children":[ ]
}
]
}
结果看起来像
如您所见,只有一个“公司”节点具有展开/折叠图标。
对于类似的问题,我只找到了一个建议, 在没有子级Extjs的节点上Treepanel展开/折叠,后者使用css破解了问题,但不知道在哪里插入此样式。
先感谢您。
仅针对那些需要“故事终结”的人。
如果您依靠spring和jackson来呈现json作为响应,并且想跳过空子级,则可以在yourApp-servlet.xml中配置MappingJackson2HttpMessageConverter来做到这一点。
<mvc:annotation-driven>
<mvc:message-converters>
<beans:bean class="org.springframework.http.converter.json.MappingJackson2HttpMessageConverter">
<beans:property name="objectMapper" ref="objectMapper"/>
</beans:bean>
</mvc:message-converters>
</mvc:annotation-driven>
<beans:bean name="objectMapper" class="org.springframework.http.converter.json.Jackson2ObjectMapperFactoryBean" autowire="no">
<beans:property name="dateFormat">
<beans:bean class="java.text.SimpleDateFormat">
<beans:constructor-arg type="java.lang.String" value="yyyy-MM-dd HH:mm:ss"/>
</beans:bean>
</beans:property>
<beans:property name="featuresToDisable">
<beans:list>
<beans:value type="com.fasterxml.jackson.databind.SerializationFeature">WRITE_EMPTY_JSON_ARRAYS</beans:value>
</beans:list>
</beans:property>
</beans:bean>
问候。
您正在为节点提供子数据,因此ExtJS假定该节点已加载。
为您的惰性节点删除“ children”:[] ,将进行查询以按需加载它们。
然后,您的服务器必须返回提供的节点的数据。 例如,如果您尝试扩展节点“ Company 1”,则查询应类似于: http:// localhost /?node = 1
另外,如果您的节点没有任何子节点,则应将leaf设置为true 。
附带说明,为减少数据传输量,您的许多参数(expandable,allowChildren等)都可以使用或为默认值,应将其跳过。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.