diff --git a/src/views/page/index.vue b/src/views/page/index.vue index 90c5d05f..da146485 100644 --- a/src/views/page/index.vue +++ b/src/views/page/index.vue @@ -30,7 +30,7 @@ -
+
@@ -559,6 +559,28 @@ const fieldNames: TreeProps['fieldNames'] = { } const loading = ref(false) //四级组织树获取 +const scrollContainer = ref() +// 定位树节点 +const scrollToMatchedNode = (searchValue: string) => { + nextTick(() => { + try { + // console.log(treeRef.value) //这是一个proxy对象,并不是根元素 + const treeEl = scrollContainer.value.querySelector('.ant-tree') + const titleElements = treeEl.querySelectorAll('.ant-tree-title') + let matchedNode = null + titleElements.forEach((element: any) => { + if (element.textContent.trim() === searchValue) { + matchedNode = element + } + }) + console.log('matchedNode_________', matchedNode) + if (matchedNode) { + // 将包含该节点的滚动容器滚动到目标元素的位置 + ;(matchedNode as HTMLElement).scrollIntoView({ behavior: 'smooth', block: 'center' }) + } + } catch (error) {} + }) +} const treedataall = ref([]) const searchValue = ref('') //搜索 const treeRef = ref() // 创建一个 ref 用来引用 a-tree 组件 @@ -628,7 +650,9 @@ const onSearch = () => { selectedKeys.value = keysToSelect if (selectedKeys.value.length > 0) { console.log('selectedKeys.value', selectedKeys.value) - scrollToKey(selectedKeys.value[0]) + + scrollToMatchedNode(searchValue.value) + // scrollToKey(selectedKeys.value[0]) } } const refreshTreeData = () => {