From: Jinjiang Date: Sat, 8 Apr 2023 02:31:31 +0000 (+0800) Subject: docs(zh): sync update to 1a3a28f (#1773) X-Git-Tag: v4.2.0~21 X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=cc9f56b88e3fb033acb78b0f78a0955c04892675;p=thirdparty%2Fvuejs%2Frouter.git docs(zh): sync update to 1a3a28f (#1773) Co-authored-by: GU Yiling --- diff --git a/packages/docs/zh/guide/advanced/composition-api.md b/packages/docs/zh/guide/advanced/composition-api.md index 306268af..5be3166b 100644 --- a/packages/docs/zh/guide/advanced/composition-api.md +++ b/packages/docs/zh/guide/advanced/composition-api.md @@ -91,7 +91,7 @@ export default { ## `useLink` -Vue Router 将 RouterLink 的内部行为作为一个组合式 API 函数公开。它提供了与 [`v-slot` API](../../api/#router-link-s-v-slot) 相同的访问属性: +Vue Router 将 RouterLink 的内部行为作为一个组合式函数 (composable) 公开。它接收一个类似 `RouterLink` 所有 prop 的响应式对象,并暴露底层属性来构建你自己的 `RouterLink` 组件或生成自定义链接: ```js import { RouterLink, useLink } from 'vue-router' @@ -107,7 +107,18 @@ export default { }, setup(props) { - const { route, href, isActive, isExactActive, navigate } = useLink(props) + const { + // 解析出来的路由对象 + route, + // 用在链接里的 href + href, + // 布尔类型的 ref 标识链接是否为激活的 + isActive, + // 布尔类型的 ref 标识链接是否为严格活跃的 + isExactActive, + // 导航至该链接的函数 + navigate + } = useLink(props) const isExternalLink = computed( () => typeof props.to === 'string' && props.to.startsWith('http') @@ -117,3 +128,5 @@ export default { }, } ``` + +注意在 RouterLink 的 `v-slot` 中可以访问与 `useLink` 组合式函数相同的属性。 diff --git a/packages/docs/zh/guide/advanced/dynamic-routing.md b/packages/docs/zh/guide/advanced/dynamic-routing.md index 70991f16..5ad3bcac 100644 --- a/packages/docs/zh/guide/advanced/dynamic-routing.md +++ b/packages/docs/zh/guide/advanced/dynamic-routing.md @@ -59,23 +59,30 @@ router.beforeEach(to => { 有几个不同的方法来删除现有的路由: - 通过添加一个名称冲突的路由。如果添加与现有途径名称相同的途径,会先删除路由,再添加路由: + ```js router.addRoute({ path: '/about', name: 'about', component: About }) // 这将会删除之前已经添加的路由,因为他们具有相同的名字且名字必须是唯一的 router.addRoute({ path: '/other', name: 'about', component: Other }) ``` + - 通过调用 `router.addRoute()` 返回的回调: + ```js const removeRoute = router.addRoute(routeRecord) removeRoute() // 删除路由如果存在的话 ``` + 当路由没有名称时,这很有用。 + - 通过使用 `router.removeRoute()` 按名称删除路由: + ```js router.addRoute({ path: '/about', name: 'about', component: About }) // 删除路由 router.removeRoute('about') ``` + 需要注意的是,如果你想使用这个功能,但又想避免名字的冲突,可以在路由中使用 `Symbol` 作为名字。 当路由被删除时,**所有的别名和子路由也会被同时删除** @@ -104,5 +111,5 @@ router.addRoute({ Vue Router 提供了两个功能来查看现有的路由: -- [`router.hasRoute()`](../../api/#hasroute):检查路由是否存在。 -- [`router.getRoutes()`](../../api/#getroutes):获取一个包含所有路由记录的数组。 +- [`router.hasRoute()`](../../api/interfaces/Router.md#Methods-hasRoute):检查路由是否存在。 +- [`router.getRoutes()`](../../api/interfaces/Router.md#Methods-getRoutes):获取一个包含所有路由记录的数组。 diff --git a/packages/docs/zh/guide/essentials/history-mode.md b/packages/docs/zh/guide/essentials/history-mode.md index 24272629..71f4fa38 100644 --- a/packages/docs/zh/guide/essentials/history-mode.md +++ b/packages/docs/zh/guide/essentials/history-mode.md @@ -47,7 +47,7 @@ const router = createRouter({ ## 服务器配置示例 -**注意**:以下示例假定你正在从根目录提供服务。如果你部署到子目录,你应该使用[Vue CLI 的 `publicPath` 配置](https://cli.vuejs.org/config/#publicpath)和相关的[路由器的 `base` 属性](../../api/#createwebhistory)。你还需要调整下面的例子,以使用子目录而不是根目录(例如,将`RewriteBase/` 替换为 `RewriteBase/name-of-your-subfolder/`)。 +**注意**:以下示例假定你正在从根目录提供服务。如果你部署到子目录,你应该使用[Vue CLI 的 `publicPath` 配置](https://cli.vuejs.org/config/#publicpath)和相关的[路由器的 `base` 属性](../../api/#Functions-createWebHistory)。你还需要调整下面的例子,以使用子目录而不是根目录(例如,将`RewriteBase/` 替换为 `RewriteBase/name-of-your-subfolder/`)。 ### Apache diff --git a/packages/docs/zh/guide/migration/index.md b/packages/docs/zh/guide/migration/index.md index c3cb6eb4..5604e9cb 100644 --- a/packages/docs/zh/guide/migration/index.md +++ b/packages/docs/zh/guide/migration/index.md @@ -207,7 +207,7 @@ app.config.globalProperties.append = (path, pathToAppend) => ### 删除 `router.match` 改为 `router.resolve` -`router.match` 和 `router.resolve` 已合并到 `router.resolve` 中,签名略有不同。[详见 API](/api/interfaces/Router#Methods-resolve)。 +`router.match` 和 `router.resolve` 已合并到 `router.resolve` 中,签名略有不同。[详见 API](/zh/api/interfaces/Router#Methods-resolve)。 **原因**:将用于同一目的的多种方法统一起来。 @@ -414,10 +414,10 @@ const routes = [ -给定任何[规范化的路由地址](/api/interfaces/RouteLocationNormalized.md): +给定任何[规范化的路由地址](/zh/api/interfaces/RouteLocationNormalized.md): - `path`, `fullPath`中的值不再被解码了。例如,直接在地址栏上写 " world",将得到编码后的版本:"https://example.com/hello%20world",而 "path "和 "fullPath "都是"/hello%20world"。 -- `hash` 现在被解码了,这样就可以复制过来。`router.push({ hash: $route.hash })` 可以直接用于 [scrollBehavior](/api/interfaces/RouterOptions.md#Properties-scrollBehavior) 的 `el` 配置中。 +- `hash` 现在被解码了,这样就可以复制过来。`router.push({ hash: $route.hash })` 可以直接用于 [scrollBehavior](/zh/api/interfaces/RouterOptions.md#Properties-scrollBehavior) 的 `el` 配置中。 - 当使用 `push`、`resolve` 和 `replace` 并在对象中提供 `string` 地址或 `path` 属性时,**必须进行编码**(像以前的版本一样)。另一方面,`params`、`query` 和 `hash` 必须以未编码的版本提供。 - 斜线字符(`/`)现在已在 `params` 内正确解码,同时仍在 URL 上产生一个编码版本:`%2F`。