Skip to content

docs(zh): update #3446

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Jan 24, 2021
Merged
Show file tree
Hide file tree
Changes from 4 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
54 changes: 54 additions & 0 deletions docs/zh/api/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -321,6 +321,26 @@ sidebar: auto

当前路由对应的[路由信息对象](#路由对象)。

### router.START_LOCATION

- 类型: `Route`

初始路由地址,表示路由开始的[路由信息对象](#路由对象)。可用在导航守卫以区分初始导航。

```js
import Router from 'vue-router'

const router = new Router({
// ...
})

router.beforeEach((to, from) => {
if (from === START_LOCATION) {
// 初始导航
}
})
```

## Router 实例方法

### router.beforeEach
Expand Down Expand Up @@ -371,6 +391,8 @@ router.forward()

动态的导航到一个新 URL。参考[编程式导航](../guide/essentials/navigation.md)。

这些函数仅在安装路由插件并将其传递给 Vue 根实例后调用,如[起步](../guide/README.md)所示。

### router.getMatchedComponents

函数签名:
Expand Down Expand Up @@ -400,6 +422,8 @@ const resolved: {

### router.addRoutes

*废弃*: 使用 [`route.addRoute()`](#router-addroute) 代替。

函数签名:

```js
Expand All @@ -408,6 +432,36 @@ router.addRoutes(routes: Array<RouteConfig>)

动态添加更多的路由规则。参数必须是一个符合 `routes` 选项要求的数组。

### router.addRoute

添加一条新路由规则。如果该路由规则有 `name`,并且已经存在一个与之相同的名字,则会覆盖它。

函数签名:

```ts
addRoute(route: RouteConfig): () => void
```

### router.addRoute

添加一条新的路由规则记录作为现有路由的子路由。如果该路由规则有 `name`,并且已经存在一个与之相同的名字,则会覆盖它。

函数签名:

```ts
addRoute(parentName: string, route: RouteConfig): () => void
```

### router.getRoutes

获取所有激活的路由记录列表。**注意只有记录的属性才被视为公共 API**,避免使用任何其他属性,例如 `regex`,因为它在 Vue Router 4 中不存在。

函数签名:

```ts
getRoutes(): RouteRecord[]
```

### router.onReady

函数签名:
Expand Down
2 changes: 1 addition & 1 deletion docs/zh/guide/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@

<div class="vueschool"><a href="https://vueschool.io/courses/vue-router-for-everyone?friend=vuejs" target="_blank" rel="sponsored noopener" title="Learn how to build powerful Single Page Applications with the Vue Router on Vue School">观看 Vue School 的关于 Vue Router 的免费视频课程 (英文)</a></div>

用 Vue.js + Vue Router 创建单页应用,是非常简单的。使用 Vue.js ,我们已经可以通过组合组件来组成应用程序,当你要把 Vue Router 添加进来,我们需要做的是,将组件 (components) 映射到路由 (routes),然后告诉 Vue Router 在哪里渲染它们。下面是个基本例子:
用 Vue.js + Vue Router 创建单页应用,感觉很自然:使用 Vue.js ,我们已经可以通过组合组件来组成应用程序,当你要把 Vue Router 添加进来,我们需要做的是,将组件 (components) 映射到路由 (routes),然后告诉 Vue Router 在哪里渲染它们。下面是个基本例子:

## HTML

Expand Down
15 changes: 15 additions & 0 deletions docs/zh/guide/advanced/scroll-behavior.md
Original file line number Diff line number Diff line change
Expand Up @@ -79,3 +79,18 @@ scrollBehavior (to, from, savedPosition) {
```

将其挂载到从页面级别的过渡组件的事件上,令其滚动行为和页面过渡一起良好运行是可能的。但是考虑到用例的多样性和复杂性,我们仅提供这个原始的接口,以支持不同用户场景的具体实现。

## 平滑滚动

只需将 `behavior` 选项添加到 `scrollBehavior` 内部返回的对象中,就可以为[支持它的浏览器](https://developer.mozilla.org/en-US/docs/Web/API/ScrollToOptions/behavior)启用原生平滑滚动:

```js
scrollBehavior (to, from, savedPosition) {
if (to.hash) {
return {
selector: to.hash,
behavior: 'smooth',
}
}
}
```