在JEECG-boot代码生成的基础上修改list页面(结合自定义的组件)
Posted 瀚岳-诸葛弩
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了在JEECG-boot代码生成的基础上修改list页面(结合自定义的组件)相关的知识,希望对你有一定的参考价值。
先上效果图:
1、在后端创建接口,获取树节点。测试通过后即可。
2、创建前端组件
两个method的全部代码为:
methods:
onLoadData(selectedNode)
let that = this
let pid = 0
if (selectedNode != null)
pid = selectedNode.dataRef.id
let params = new Object()
params.pid = pid
return new Promise(resolve =>
getAction("/jeecg-product/dict.device_catalog/dictDeviceCatalog/queryByPid", params).then(function(res)
res.forEach(function(catalog)
let node = new Object()
node.key = catalog.id
node.title = catalog.deviceCatalog
node.isLeaf = (catalog.hasChild == 1?false:true);
node.id = catalog.id
node.pid = params.pid
node.icon = "gold"
node.children=[]
debugger
if(selectedNode != null)
node.path = selectedNode.dataRef.title + "-" + node.title
else
node.path = node.title
if(selectedNode == null)
that.treeData.push(node)
else
selectedNode.dataRef.children.push(node)
// that.allTreeNodes.push(node)
)
)
resolve();
)
,
onSelectNode(nodeId, e)
let param = new Object();
param.node = e.node.dataRef
param.id = e.node.dataRef.key
param.path = e.node.dataRef.path
param.title = e.node.dataRef.title
this.$emit("SelectNode",param)
,
需要注意的是ant-design-vue中,树控件的节点只有key,title,children,isleaf为强制要求(即:根据这些属性生成树),在使用的时候可以通过dataRef获取相对应的自行构建的节点对象。
自定义组件事件:
3、前端vue调用
以上是关于在JEECG-boot代码生成的基础上修改list页面(结合自定义的组件)的主要内容,如果未能解决你的问题,请参考以下文章
在JEECG-boot代码生成的基础上修改list页面(结合自定义的组件)
Jeecg-boot 多租户改造方案(涉及菜单部门角色等基础模块)