39 lines
982 B
Markdown
39 lines
982 B
Markdown
# Footer.vue
|
||
|
||
**路径**：`src/components/Footer.vue`
|
||
|
||
## 功能用途
|
||
|
||
首页底部 Footer 组件，展示 Polymarket 品牌、支持/社交链接、Polymarket 链接、法律声明、语言选择与社交图标。
|
||
|
||
## 核心能力
|
||
|
||
- 品牌 Logo 与 Slogan
|
||
- 两列链接：Support & Social、Polymarket
|
||
- 底部法律链接、语言选择（v-select）、社交图标
|
||
- 免责声明文案
|
||
- 响应式布局（移动端垂直排列）
|
||
|
||
## 使用方式
|
||
|
||
```vue
|
||
<template>
|
||
<div class="home-page">
|
||
<!-- 主内容 -->
|
||
<Footer />
|
||
</div>
|
||
</template>
|
||
|
||
<script setup lang="ts">
|
||
import Footer from '@/components/Footer.vue'
|
||
</script>
|
||
```
|
||
|
||
父容器需设置 `display: flex; flex-direction: column; min-height: 100vh`，Footer 通过 `margin-top: auto` 贴底。
|
||
|
||
## 扩展方式
|
||
|
||
1. **多语言**：将 `footerLang` 与 `useLocaleStore` 联动
|
||
2. **链接配置**：抽成 props 或常量数组，便于维护
|
||
3. **社交图标**：可改为 props 传入，支持外部配置
|