完成头部区域收缩图标动态组件的功能实现

Conversation 0 Commits 3 Files Changed 6

ppnwsfegt commented

Owner

完成头部区域收缩图标动态组件的功能实现

ppnwsfegt added 3 commits

0039a33026 在layout文件夹中创建header文件夹，用来存放header区域相关组件

在header文件夹中新建Header.vue、Collapse.vue、LoginOut.vue文件
分别对应头部整体区域、收缩按钮组件、退出登录组件

将Collapse.vue、LoginOut.vue引入Header.vue
为Header.vue配置样式

在layout.Index.vue主页引入Header.vue
对Index.vue中的header区域添加样式，分隔收缩图标和退出登录

226956648c Merge branch 'main' of https://bdgit.educoder.net/ppnwsfegt/WXCampusFoodOrdering into Brunch_LPQ

3e93e011b1 在store文件夹中，创建collapse文件夹，以及index.ts文件

配置index.ts文件，存储一个布尔值，用来控制图标变化

在vite-env.d.ts文件中配置store的导出

在layout.header/Collapse.vue中，添加动态组件
通过动态组件，实现图标点击事件

为图标添加点击事件，点击后store中存储的值取反，结合动态组件改变图标状态

ps：使用动态组件时，需要局部引入图标

ppnwsfegt merged commit 51e436f1fb into main 5 months ago

ppnwsfegt referenced this issue from a commit

Merge pull request '完成头部区域收缩图标动态组件的功能实现' (#13) from Brunch_LPQ into main

The pull request has been merged as 51e436f1fb.

Sign in to join this conversation.

No reviewers

No Label

No Milestone

No project

No Assignees

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: ppnwsfegt/WXCampusFoodOrdering#13

完成头部区域收缩图标动态组件的功能实现 #13