umijs 修改默认配置_【Umi 一】 Umi 搭建配置

1、当出现_layout.js页面时默认为父组件页面，通过{props.children} 显示子组件内容；

2、嵌套路由：/users，创建 pages/users 目录

umi g page users/_layout // pages/users/_layout.js、_layout.css

1.pages/users/_layout.js

import React from 'react';

import styles from'./_layout.css';

exportdefault (props) =>{return(

Page users/_layout

{props.children}

);

}

2.为_layout.js 创建子组件，users 的首页 index.js

umi g page users/index // pages/users/index.js、index.css

3.访问嵌套路由：http://localhost:8000/users

3、约定 []包裹的文件或文件夹为动态路由、users/[name].js 对应路由为/users/:name

在 users 目录中，再创建 [name].js、[name].css

访问[name].js：http://localhost:8000/users/xxx

4、跳转路由 (Link，history)

1.users/index.js

import React from 'react';

import styles from'./index.css';

import {Link} from'umi';

exportdefault () =>{

const userList=[

{id:1, name: 'Tim'}, {id: 2, name: 'Jarry'}

]return(

• {

userList.map(item=>(

{item.name}

))

}

);

}