From 83191d36e069e85502825e26e33daa1ec114ed74 Mon Sep 17 00:00:00 2001
From: lipenghui <mrkezhi@163.com>
Date: Thu, 25 Jan 2024 18:47:29 +0800
Subject: [PATCH] =?UTF-8?q?fix:=E4=BF=AE=E6=94=B9=E4=BB=BB=E5=8A=A1?=
 =?UTF-8?q?=E4=B8=ADref=E7=9A=84ts=E7=B1=BB=E5=9E=8B=E5=A3=B0=E6=98=8E;?=
 =?UTF-8?q?=E4=BF=AE=E6=94=B9=E6=89=93=E5=8C=85=E9=85=8D=E7=BD=AE=EF=BC=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/AppTaskMenuList/index.d.ts | 10 +++++-----
 src/components/AppTaskMenuList/index.vue  | 11 ++++++++---
 src/views/task/index.vue                  |  9 +++++----
 vite.config.ts                            |  2 ++
 4 files changed, 20 insertions(+), 12 deletions(-)

diff --git a/src/components/AppTaskMenuList/index.d.ts b/src/components/AppTaskMenuList/index.d.ts
index 85c6f85..e8f16eb 100644
--- a/src/components/AppTaskMenuList/index.d.ts
+++ b/src/components/AppTaskMenuList/index.d.ts
@@ -1,10 +1,10 @@
 import type { Ref } from 'vue'
 
-interface Task {
-  task1: Ref<HTMLElementl>
-  task2: Ref<HTMLElement>
-  task3: Ref<HTMLElement>
-  task4: Ref<HTMLElement>
+interface Task<T> {
+  [key: string]: Ref<T>
+  // task2: Ref<HTMLElement>
+  // task3: Ref<HTMLElement>
+  // task4: Ref<HTMLElement>
 }
 interface ListType {
   title: string
diff --git a/src/components/AppTaskMenuList/index.vue b/src/components/AppTaskMenuList/index.vue
index 73b1664..052ea65 100644
--- a/src/components/AppTaskMenuList/index.vue
+++ b/src/components/AppTaskMenuList/index.vue
@@ -1,12 +1,13 @@
 <!-- 子菜单列表组件 -->
 <script setup lang="ts">
+import type { ComponentPublicInstance, Ref } from 'vue'
 import { computed, inject, ref } from 'vue'
 import type { Task } from './index.d'
 import { useTaskListStore } from '@/store/moules/taskListStore'
 
 const taskListStore = useTaskListStore()
-const sectionRefs = inject<Task>('sectionRefs')
-const taskContainer = inject('taskContainer')
+const sectionRefs = inject<Task<ComponentPublicInstance>>('sectionRefs')
+const taskContainer = inject<Ref<HTMLElement>>('taskContainer')
 const activeIndex = ref(0)
 
 const list = computed(() => [
@@ -35,9 +36,13 @@ const list = computed(() => [
 function handleClick(index: number, task: string) {
   activeIndex.value = index
 
+  if (!sectionRefs) {
+    return
+  }
+
   const target = sectionRefs[task].value.$el.offsetTop - 40
 
-  taskContainer.value.scrollTo({
+  taskContainer?.value.scrollTo({
     top: target,
     behavior: 'smooth',
   })
diff --git a/src/views/task/index.vue b/src/views/task/index.vue
index 29686ca..9d4906e 100644
--- a/src/views/task/index.vue
+++ b/src/views/task/index.vue
@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import type { ComponentPublicInstance, Ref } from 'vue'
 import { provide, ref } from 'vue'
 import { BasicTask } from './components/BasicTask'
 import { NoviceTask } from './components/NoviceTask'
@@ -11,10 +12,10 @@ import { AppSubMenuTitle } from '@/components/AppSubMenuTitle'
 import { AppTaskMenuList } from '@/components/AppTaskMenuList'
 
 const taskContainer = ref(null)
-const task1 = ref(null)
-const task2 = ref(null)
-const task3 = ref(null)
-const task4 = ref(null)
+const task1 = ref<Ref<ComponentPublicInstance> | null>(null)
+const task2 = ref<Ref<ComponentPublicInstance> | null>(null)
+const task3 = ref<Ref<ComponentPublicInstance> | null>(null)
+const task4 = ref<Ref<ComponentPublicInstance> | null>(null)
 const sectionRefs = { task1, task2, task3, task4 }
 provide('sectionRefs', sectionRefs)
 provide('taskContainer', taskContainer)
diff --git a/vite.config.ts b/vite.config.ts
index 186efa8..991cdc2 100644
--- a/vite.config.ts
+++ b/vite.config.ts
@@ -17,6 +17,8 @@ export default defineConfig({
       symbolId: 'icon-[name]',
     }),
   ],
+  base: './',
+  publicDir: 'public',
   server: {
     host: '0.0.0.0',
   },