vue3createrouter方法作用
时间: 2023-11-04 09:16:39 浏览: 210
vue.js中created方法作用
5星 · 资源好评率100%
`createRouter()` 是 Vue Router 4 中的一个工厂函数,用于创建一个路由实例对象。通过调用 `createRouter()` 方法,可以创建一个路由实例对象,我们可以在该实例对象中定义路由规则、导航守卫等。
具体来说,`createRouter()` 方法的作用有以下几点:
1. 创建一个路由实例对象;
2. 注册路由规则;
3. 注册全局的前置守卫、后置守卫等;
4. 返回路由实例对象。
在使用 `createRouter()` 方法时,需要传入一个路由配置对象,该对象可以包含如下属性:
- `history`:指定路由的模式,可以是 `hash` 或者 `history`;
- `routes`:定义路由的具体规则;
- `scrollBehavior`:控制页面滚动的行为。
示例代码如下:
```
import { createRouter, createWebHistory } from 'vue-router'
const router = createRouter({
history: createWebHistory(),
routes: [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/about',
name: 'About',
component: About
}
],
scrollBehavior(to, from, savedPosition) {
return { top: 0 }
}
})
export default router
```
在上面的示例代码中,我们使用了 `createRouter()` 方法创建了一个路由实例对象,并且传入了一个包含 `history` 和 `routes` 属性的路由配置对象,最后将该路由实例对象导出,以便在其他组件中使用。
阅读全文