Explorar el Código

首页博物馆列表sidebar点击功能(移动端)

任一存 hace 2 años
padre
commit
1c32f497d8
Se han modificado 1 ficheros con 8 adiciones y 3 borrados
  1. 8 3
      code/src/views/home/maside.vue

+ 8 - 3
code/src/views/home/maside.vue

@@ -15,7 +15,7 @@
           <section>
             <ul v-if="list.length > 0">
               <li v-for="(sub, idx) in list" :key="idx">
-                <p>{{ sub.type }}</p>
+                <p :id="'aside-list-sidebar-' + sub.type">{{ sub.type }}</p>
                 <ul v-if="sub.arr.length > 0">
                   <li  @click="onClickItem(son)" v-for="(son, sonidx) in sub.arr" :key="sonidx">
                     {{ son.name }}
@@ -27,7 +27,7 @@
 
           <div class="sidebar">
             <ul>
-              <li v-for="(item, i) in charStrs" :key="i">
+              <li v-for="(item, i) in charStrs" :key="i" @click="onClickSidebarItem(item)">
                 {{ item }}
               </li>
             </ul>
@@ -74,7 +74,12 @@ const onClickSelect = (data) => {
   isShow.value = true
   currentId.value = data.id
 }
-
+const onClickSidebarItem = (item) => {
+  const targetNode = document.getElementById('aside-list-sidebar-' + item)
+  if (targetNode) {
+    targetNode.scrollIntoView()
+  }
+}
 
 const onClickItem = data => {
   if (currentId.value=='museum') {