扩展节点菜单
鸿图的节点菜单使用了 antd 的 Tree 组件,开发者可以参考 antd 官方文档实现。示例:
ts
{
label: '自定义节点列表',
children: [
{
label: '我的自定义节点',
searchKeys: 'my custom node',
nodeType: 'MyCustomeNodeType'
}
]
}
注意
nodeType
一定要和自定义节点的 type
一致。
searchKeys 用于搜索,如下图:
扩展数据
对于复杂的自定义节点,可以添加 data 字段,用于扩展节点数据。
ts
{
label: '自定义节点列表',
children: [
{
label: '我的自定义节点',
searchKeys: 'my custom node',
nodeType: 'MyCustomeNodeType',
data: {}
},
]
}
扩展的数据字段名只能为 data
。它会作为自定义节点的属性传入。如:
tsx
const MyNode = ({ id, selected, data }: NodeProps) => {
return (<></>)
}
上面例子中,MyNode 是一个自定义的鸿图节点组件,其中的属性 data
就是扩展的数据。
国际化
插件接口 createMenu(language: string)
中的language
参数可以方便开发者实现国际化。它和鸿图的语言是同步的,可以在鸿图编辑器的设置
里面修改。