From df836529db63360f0bf9810ccd4e8911846aef45 Mon Sep 17 00:00:00 2001 From: RadiumAg <2043869032@qq.com> Date: Mon, 8 Aug 2022 22:02:04 +0800 Subject: [PATCH] docs: improve Chinese translation (#1505) Co-authored-by: edison --- .../docs/zh/guide/essentials/nested-routes.md | 30 +++++++++++++++++++ 1 file changed, 30 insertions(+) diff --git a/packages/docs/zh/guide/essentials/nested-routes.md b/packages/docs/zh/guide/essentials/nested-routes.md index b7cc1a0c..84fa3087 100644 --- a/packages/docs/zh/guide/essentials/nested-routes.md +++ b/packages/docs/zh/guide/essentials/nested-routes.md @@ -98,3 +98,33 @@ const routes = [ ``` 这个例子的 demo 可以在[这里](https://codesandbox.io/s/nested-views-vue-router-4-examples-hl326?initialpath=%2Fusers%2Feduardo)找到。 + +## 嵌套的命名路由 + +在处理[命名路由](./named-routes.md)时,**你通常会给子路由命名**: + +```js +const routes = [ + { + path: '/user/:id', + component: User, + // 请注意,只有子路由具有名称 + children: [{ path: '', name: 'user', component: UserHome }], + }, +] +``` + +这将确保导航到 `/user/:id` 时始终显示嵌套路由。 + +在一些场景中,你可能希望导航到命名路由而不导航到嵌套路由。例如,你想导航 `/user/:id` 而不显示嵌套路由。那样的话,你还可以**命名父路由**,但请注意**重新加载页面将始终显示嵌套的子路由**,因为它被视为指向路径`/users/:id` 的导航,而不是命名路由: + +```js +const routes = [ +  { +    path: '/user/:id', +    name: 'user-parent' +    component: User, +    children: [{ path: '', name: 'user', component: UserHome }], +  }, +] +``` -- 2.47.2