42 lines
1.0 KiB
Markdown
42 lines
1.0 KiB
Markdown
# 实现步骤
|
|
|
|
1. **创建新页面组件**:在 `src/views/` 目录下创建 `Waitlist.vue` 组件,用于展示"已加入候补队列,等待审核中"的提示
|
|
2. **添加多语言支持**:在 `src/locales/index.js` 中添加对应的中英文文本
|
|
3. **配置路由**:在 `src/router/index.js` 中添加一个新的路由,指向这个新组件
|
|
|
|
# 详细实现
|
|
|
|
## 1. 创建 Waitlist.vue 组件
|
|
|
|
* 参考 `NotFound.vue` 的结构和样式
|
|
|
|
* 展示"已加入候补队列,等待审核中"的提示信息
|
|
|
|
* 添加返回首页的按钮
|
|
|
|
* 适配响应式设计
|
|
|
|
## 2. 添加多语言支持
|
|
|
|
在 `src/locales/index.js` 的 `zh` 和 `en` 对象中分别添加:
|
|
|
|
* `waitlist.title`: 标题文本
|
|
|
|
* `waitlist.description`: 描述文本
|
|
|
|
* `waitlist.goHome`: 返回首页按钮文本
|
|
|
|
## 3. 配置路由
|
|
|
|
在 `src/router/index.js` 中添加一个新的路由:
|
|
|
|
```javascript
|
|
{
|
|
path: '/waitlist',
|
|
name: 'Waitlist',
|
|
component: () => import('@/views/Waitlist.vue'),
|
|
meta: { requiresAuth: false, keepAlive: false, fullScreen: true }
|
|
}
|
|
```
|
|
|