Browse Source

fix:修改任务中ref的ts类型声明;修改打包配置;

dxj
李朋徽 1 year ago
parent
commit
83191d36e0
  1. 10
      src/components/AppTaskMenuList/index.d.ts
  2. 11
      src/components/AppTaskMenuList/index.vue
  3. 9
      src/views/task/index.vue
  4. 2
      vite.config.ts

10
src/components/AppTaskMenuList/index.d.ts vendored

@ -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

11
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',
})

9
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)

2
vite.config.ts

@ -17,6 +17,8 @@ export default defineConfig({
symbolId: 'icon-[name]',
}),
],
base: './',
publicDir: 'public',
server: {
host: '0.0.0.0',
},

Loading…
Cancel
Save