feat: 优化 FolderTree 层级展开的代码
This commit is contained in:
parent
3ae8a65f70
commit
e4b5fab2fa
@ -27,6 +27,7 @@ export default {
|
|||||||
required: false,
|
required: false,
|
||||||
default: [],
|
default: [],
|
||||||
},
|
},
|
||||||
|
// 文件树展开层级。-1 表示全部展开,0 表示不展开,1 表示仅展开一层
|
||||||
expandLevel: {
|
expandLevel: {
|
||||||
type: Number,
|
type: Number,
|
||||||
required: false,
|
required: false,
|
||||||
@ -57,10 +58,12 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 以 treeData 为源数据,渲染文件树
|
||||||
renderTreeByTreeData(currentTreeData) {
|
renderTreeByTreeData(currentTreeData) {
|
||||||
const renderNode = this.renderNodeByNodeData(currentTreeData, 1)
|
const renderNode = this.renderNodeByNodeData(currentTreeData, 0)
|
||||||
this.treeRenderData = renderNode == null ? [] : [renderNode]
|
this.treeRenderData = renderNode == null ? [] : [renderNode]
|
||||||
},
|
},
|
||||||
|
// 渲染文件树节点。level 表示 nodeData 在文件树的层级(从 0 开始计数)
|
||||||
renderNodeByNodeData(nodeData, level) {
|
renderNodeByNodeData(nodeData, level) {
|
||||||
// 判断必须包含的字段,没有则返回 null
|
// 判断必须包含的字段,没有则返回 null
|
||||||
if (nodeData == null || nodeData == undefined) {
|
if (nodeData == null || nodeData == undefined) {
|
||||||
@ -85,14 +88,15 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
let allowExpand = this.expandLevel < 0 || level <= this.expandLevel
|
let allowExpand = this.expandLevel < 0 || level < this.expandLevel
|
||||||
let nodeRenderData = {
|
let nodeRenderData = {
|
||||||
title: nodeData.name,
|
title: nodeData.name,
|
||||||
directory: nodeData.directory,
|
directory: nodeData.directory,
|
||||||
expand: (allowExpand && nodeData.directory) ? true : false,
|
expand: (allowExpand && nodeData.directory) ? true : false,
|
||||||
|
selected: this.selectedNode.includes(nodeData.path),
|
||||||
// 附带数据,不直接参与渲染
|
// 附带数据,不直接参与渲染
|
||||||
path: nodeData.path,
|
path: nodeData.path,
|
||||||
selected: this.selectedNode.includes(nodeData.path),
|
level: level,
|
||||||
}
|
}
|
||||||
if (nodeData.directory) {
|
if (nodeData.directory) {
|
||||||
let childrenRenderData = []
|
let childrenRenderData = []
|
||||||
@ -143,7 +147,7 @@ export default {
|
|||||||
|
|
||||||
// 向父组件暴露当前选中的文件
|
// 向父组件暴露当前选中的文件
|
||||||
this.$emit('file-selected', nodeData);
|
this.$emit('file-selected', nodeData);
|
||||||
}
|
},
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user