配置式路由
当使用了路由配置后,约定式路由全部失效。
两种方式书写umi配置:
- 使用根目录下的文件
.
- 使用根目录下的文件
config/
进行路由配置时,每个配置就是一个匹配规则,并且,每个配置是一个对象,对象中的某些属性,会直接形成Route组件的属性
注意:
- component配置项,需要填写页面组件的路径,路径相对于pages文件夹
- 如果配置项没有exact,则会自动添加exact为true
- 每一个路由配置,可以添加任何属性
- Routes属性是一个数组,数组的每一项是一个组件路径,路径相对于项目根目录,当匹配到路由后,会转而渲染该属性指定的组件,并会将component组件作为children放到匹配的组件中
路由配置中的信息,同样可以放到约定式路由中,方式是,为约定式路由添加第一个文档注释(注释的格式的YAML),需要将注释放到最开始的位置
YAML格式
- 键值对,冒号后需要加上空格
- 如果某个属性有多个键或多个值,需要进行缩进(空格)
.
export default {
routes: [
{
path: "/",
component: "../layouts/",
exact: false,
routes: [
{
path: "/", component: "./index", title: "首页",
Routes: ["./src/routes/"]
},
{
path: "/login", component: "./login", title: "登录页",
Routes: ["./src/routes/"]
},
{
path: "/welcome", component: "./welcome", title: "欢迎页",
Routes: ["./src/routes/", "./src/routes/"]
}
]
}
]
}