a-tree-select 在选中某一个节点时,回显到框中的名称默认为该节点的title,如下:
但是如果需要想显示类似aaa/bbb2/ccc2这种全部路径,参考api treeNodeLabelProp该属性,重新设置它;
主要代码:
<a-tree-select
allowClear
:showSearch="true"
treeNodeLabelProp="label"
:dropdownStyle="{ maxHeight: '400px', overflow: 'auto' }"
:treeData="treeData"
:replace-fields="replaceFields"
v-decorator="['id', validatorRules.deptId]"
>
</a-tree-select>
其中label为拿到treeData数据时处理后的全部路径(aaa/bbb2/ccc2):
formatTreeData(arr,name){
return arr.map(item=>(
{
label:(name?`${name}/`:'')+item.title,
value:item.value,
title:item.title,
childList:Array.isArray(item.childList)? this.formatTreeData(item.childList,(name?`${name}/`:'')+item.title):null
}
))
}