Bläddra i källkod

chore: update

xiaoxian521 2 år sedan
förälder
incheckning
0c5ecd0a4e

+ 3 - 3
src/router/enums.ts

@@ -5,8 +5,8 @@ const home = 0, // 平台规定只有 home 路由的 rank 才能为 0 ,所以
   utils = 2,
   table = 3,
   tree = 4,
-  able = 5,
-  components = 6,
+  components = 5,
+  able = 6,
   frame = 7,
   nested = 8,
   result = 9,
@@ -28,8 +28,8 @@ export {
   utils,
   table,
   tree,
-  able,
   components,
+  able,
   frame,
   nested,
   result,

+ 4 - 0
src/router/modules/components.ts

@@ -19,6 +19,10 @@ export default {
         extraIcon: {
           svg: true,
           name: "team-iconxinpinrenqiwang"
+        },
+        transition: {
+          enterTransition: "animate__fadeInLeft",
+          leaveTransition: "animate__fadeOutRight"
         }
       }
     },

+ 2 - 2
src/views/components/message/index.vue

@@ -19,7 +19,7 @@ defineOptions({
 
     <h4 class="mb-4">element-plus 的消息提示,点击弹出提示信息</h4>
 
-    <el-space>
+    <el-space wrap>
       <el-button
         type="info"
         @click="message('Info类型消息', { customClass: 'el' })"
@@ -119,7 +119,7 @@ defineOptions({
       原本样式,使用和打包大小成本极低并适配暗黑模式)
     </h4>
 
-    <el-space>
+    <el-space wrap>
       <el-button type="info" @click="message('Info类型消息')">Info</el-button>
       <el-button
         type="success"

+ 10 - 3
src/views/pure-table/index.vue

@@ -1,9 +1,16 @@
 <script setup lang="ts">
+import { ref } from "vue";
 import { list } from "./base/list";
 
 defineOptions({
   name: "PureTable"
 });
+
+const selected = ref(0);
+
+function tabClick({ index }) {
+  selected.value = index;
+}
 </script>
 
 <template>
@@ -32,9 +39,9 @@ defineOptions({
       :closable="false"
     />
 
-    <el-tabs>
+    <el-tabs @tab-click="tabClick">
       <template v-for="(item, index) of list" :key="item.key">
-        <el-tab-pane>
+        <el-tab-pane :lazy="true">
           <template #label>
             <el-tooltip
               :content="`(第 ${index + 1} 个示例)${item.content}`"
@@ -43,7 +50,7 @@ defineOptions({
               <span>{{ item.title }}</span>
             </el-tooltip>
           </template>
-          <component :is="item.component" />
+          <component v-if="selected == index" :is="item.component" />
         </el-tab-pane>
       </template>
     </el-tabs>

+ 1 - 0
types/global.d.ts

@@ -214,6 +214,7 @@ declare global {
         /**
          * @description 当前路由动画效果
          * @see {@link https://next.router.vuejs.org/guide/advanced/transitions.html#transitions}
+         * @see animate.css {@link https://animate.style}
          */
         name?: string;
         /** 进场动画 */