diff --git a/src/pages/device-page.vue b/src/pages/device-page.vue index bb7e024..00c5f00 100644 --- a/src/pages/device-page.vue +++ b/src/pages/device-page.vue @@ -17,8 +17,8 @@ import { NRadio, NRadioGroup, NScrollbar, - NTabPane, NTabs, + NTab, NTag, NTree, type TagProps, @@ -217,8 +217,8 @@ const searchFilter = (pattern: string, node: TreeOption): boolean => { }; // ========== 设备树交互 ========== -// 定位到选中的设备 -const deviceTreeInsts = useTemplateRef('deviceTreeInsts'); +// 将多实例改为单实例,便于直接获取 Tree 实例 +const deviceTreeInst = useTemplateRef('deviceTreeInst'); const onClickLocateDeviceTree = () => { selectedTab.value = (selectedDevice.value?.deviceType ?? selectedTab.value) as DeviceTypeCode; selectedKeys.value = selectedDevice.value?.id ? [selectedDevice.value.id] : undefined; @@ -238,7 +238,7 @@ const onClickLocateDeviceTree = () => { }; const scrollDeviceTreeToSelectedDevice = (timeout: number = 500) => { setTimeout(() => { - const inst = deviceTreeInsts.value?.at(0); + const inst = deviceTreeInst.value; inst?.scrollTo({ key: selectedDevice.value?.id, behavior: 'smooth' }); }, timeout); }; @@ -262,27 +262,31 @@ const scrollDeviceTreeToSelectedDevice = (timeout: number = 500) => { -
- - - - - + +
+
+ + + +
+
+ +