瀏覽代碼

场景切换后,场景列表里active的scrollIntoView

任一存 2 年之前
父節點
當前提交
819c4ac6f4
共有 1 個文件被更改,包括 13 次插入3 次删除
  1. 13 3
      src/components/UIGather/mobile/list.vue

+ 13 - 3
src/components/UIGather/mobile/list.vue

@@ -1,6 +1,6 @@
 <template>
   <div
-    class="bar-list"
+    class="bar-list test"
     v-if="
       show &&
       !(
@@ -31,8 +31,9 @@
                 currentScene.id == item.id,
             }"
             :style="{ backgroundImage: `url(${item.icon})` }"
-            v-for="(item, i) in currentScenesList"
-            :key="i"
+            v-for="(item, ) in currentScenesList"
+            :key="item.sceneCode"
+            :id="`scene-item-${item.sceneCode}`"
           >
             <i
               class="iconfont"
@@ -136,6 +137,15 @@ const metadata = computed(() => store.getters["scene/metadata"]);
 const scenes = computed(() => store.getters["scene/list"]);
 const currentScene = computed(() => store.getters["scene/currentScene"]);
 
+watch(currentScene, (newV, oldV) => {
+  nextTick(() => {
+    const activeLiElem = document.querySelector(`#scene-item-${newV.sceneCode}`)
+    if (activeLiElem) {
+      activeLiElem.scrollIntoView()
+    }
+  })
+})
+
 const currentCatalogRoot = computed(
   () => store.getters["scene/currentCatalogRoot"]
 );