mirror of
https://github.com/WeBankFinTech/fes.js.git
synced 2025-04-06 03:59:53 +08:00
docs: 优化文档 (#187)
This commit is contained in:
parent
f680a6a51c
commit
594fd966df
@ -126,7 +126,6 @@ Fes.js 里约定名称为 `[slug]`格式的文件或文件夹映射为动态路
|
|||||||
- `src/pages/users/[id].vue` 会成为 `/users/:id`
|
- `src/pages/users/[id].vue` 会成为 `/users/:id`
|
||||||
- `src/pages/users/[id]/settings.vue` 会成为 `/users/:id/settings`
|
- `src/pages/users/[id]/settings.vue` 会成为 `/users/:id/settings`
|
||||||
|
|
||||||
|
|
||||||
:::warning
|
:::warning
|
||||||
`@slug`形式下版本会弃用,请替换为`[slug]`~
|
`@slug`形式下版本会弃用,请替换为`[slug]`~
|
||||||
:::
|
:::
|
||||||
@ -140,12 +139,10 @@ Fes.js 里约定名称为 `[...slug]`格式的文件或文件夹映射为动态
|
|||||||
- `src/pages/users/[...id].vue` 会成为 `/users/:id(.*)`
|
- `src/pages/users/[...id].vue` 会成为 `/users/:id(.*)`
|
||||||
- `src/pages/users/[...id]/settings.vue` 会成为 `/users/:id(.*)/settings`
|
- `src/pages/users/[...id]/settings.vue` 会成为 `/users/:id(.*)/settings`
|
||||||
|
|
||||||
|
|
||||||
:::warning
|
:::warning
|
||||||
`*`形式下版本会弃用,请替换为`[...slug]`~
|
`*`形式下版本会弃用,请替换为`[...slug]`~
|
||||||
:::
|
:::
|
||||||
|
|
||||||
|
|
||||||
### 嵌套路由
|
### 嵌套路由
|
||||||
|
|
||||||
Fes.js 里约定目录下有 `layout.vue` 时会生成嵌套路由,以 `layout.vue` 为该目录的公共父组件,`layout.vue` 中必须实现 `RouterView`
|
Fes.js 里约定目录下有 `layout.vue` 时会生成嵌套路由,以 `layout.vue` 为该目录的公共父组件,`layout.vue` 中必须实现 `RouterView`
|
||||||
@ -263,7 +260,7 @@ defineRouteMeta({
|
|||||||
```
|
```
|
||||||
|
|
||||||
::: tip
|
::: tip
|
||||||
推荐使用`defineRouteMete`,有更好的提示。
|
推荐使用`defineRouteMeta`,有更好的提示。
|
||||||
:::
|
:::
|
||||||
|
|
||||||
路由元信息在编译后会附加到路由配置中:
|
路由元信息在编译后会附加到路由配置中:
|
||||||
|
@ -57,7 +57,7 @@
|
|||||||
可以为页面单独设置布局类型:
|
可以为页面单独设置布局类型:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
import { defineRouteMete } from '@fesjs/fes';
|
import { defineRouteMeta } from '@fesjs/fes';
|
||||||
|
|
||||||
defineRouteMeta({
|
defineRouteMeta({
|
||||||
layout: {
|
layout: {
|
||||||
@ -73,7 +73,7 @@ defineRouteMeta({
|
|||||||
支持配置页面缓存,通过[定义路由元信息](../../../guide/route.html#扩展路由元信息)开启缓存:
|
支持配置页面缓存,通过[定义路由元信息](../../../guide/route.html#扩展路由元信息)开启缓存:
|
||||||
|
|
||||||
```js
|
```js
|
||||||
import { defineRouteMete } from '@fesjs/fes';
|
import { defineRouteMeta } from '@fesjs/fes';
|
||||||
|
|
||||||
defineRouteMeta({
|
defineRouteMeta({
|
||||||
'keep-alive': true,
|
'keep-alive': true,
|
||||||
@ -357,13 +357,15 @@ export const layout = {
|
|||||||
## API
|
## API
|
||||||
|
|
||||||
### useTabTitle
|
### useTabTitle
|
||||||
|
|
||||||
类型定义如下:
|
类型定义如下:
|
||||||
|
|
||||||
```ts
|
```ts
|
||||||
function useTabTitle(title: string | Ref<string>): void;
|
function useTabTitle(title: string | Ref<string>): void;
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
当使用多页签模式时,在页面中使用 `useTabTitle` 可以自定义页面标签:
|
当使用多页签模式时,在页面中使用 `useTabTitle` 可以自定义页面标签:
|
||||||
|
|
||||||
```vue
|
```vue
|
||||||
<script setup>
|
<script setup>
|
||||||
import { useRoute, useTabTitle } from '@fesjs/fes';
|
import { useRoute, useTabTitle } from '@fesjs/fes';
|
||||||
@ -371,13 +373,10 @@ import { useRoute, useTabTitle } from '@fesjs/fes';
|
|||||||
const titleRef = useTabTitle(`详情-${route.params?.id}`);
|
const titleRef = useTabTitle(`详情-${route.params?.id}`);
|
||||||
|
|
||||||
//如果要更新
|
//如果要更新
|
||||||
titleRef.value = "changed"
|
titleRef.value = 'changed';
|
||||||
</script>
|
</script>
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## 4.x 升级到 5.x
|
## 4.x 升级到 5.x
|
||||||
|
|
||||||
1. 个性化 layout 配置改为使用传入 navigation
|
1. 个性化 layout 配置改为使用传入 navigation
|
||||||
|
Loading…
x
Reference in New Issue
Block a user