fix(theme-default): avoid transition on fragment child (close #592)

vuepress · Dec 28, 2021 · 10e5cc0 · 10e5cc0
1 parent 4602135
commit 10e5cc0
Showing 1 changed file with 21 additions and 16 deletions.
diff --git a/packages/@vuepress/theme-default/src/client/components/SidebarItem.vue b/packages/@vuepress/theme-default/src/client/components/SidebarItem.vue
@@ -49,21 +49,26 @@ if (item.value.collapsible) {
 </script>
 
 <template>
-  <NavLink v-if="item.link" :class="itemClass" :item="item" />
-  <p v-else :class="itemClass" @click="onClick">
-    {{ item.text }}
-    <span
-      v-if="item.collapsible"
-      class="arrow"
-      :class="isOpen ? 'down' : 'right'"
-    />
-  </p>
+  <li>
+    <NavLink v-if="item.link" :class="itemClass" :item="item" />
+    <p v-else :class="itemClass" @click="onClick">
+      {{ item.text }}
+      <span
+        v-if="item.collapsible"
+        class="arrow"
+        :class="isOpen ? 'down' : 'right'"
+      />
+    </p>
 
-  <DropdownTransition v-if="item.children?.length">
-    <ul v-show="isOpen" class="sidebar-item-children">
-      <li v-for="child in item.children" :key="child.text">
-        <SidebarItem :item="child" :depth="depth + 1" />
-      </li>
-    </ul>
-  </DropdownTransition>
+    <DropdownTransition v-if="item.children?.length">
+      <ul v-show="isOpen" class="sidebar-item-children">
+        <SidebarItem
+          v-for="child in item.children"
+          :key="`${depth}${child.text}${child.link}`"
+          :item="child"
+          :depth="depth + 1"
+        />
+      </ul>
+    </DropdownTransition>
+  </li>
 </template>