一、Mock 数据
umi 里约定 mock 文件夹下的文件或者 page(s) 文件夹下的 _mock 文件即 mock 文件。
这个mock数据,默认导出的结果,前面为请求方式和请求的url,后面的为返回前端的结果。结果可以是函数,也可以是对象
关闭mock:直接返回mock:false,就可以关闭mock了。如果是用的ant design pro那么直接运行命令的时候就可以关闭mock
- 注:返回值为函数的时候就很灵活,函数里面就相当于在写java代码一样(只不过还是js语法),可以设置返回头,req.body相当于请求体里面是传过来的请求参数,而用res.send()来返回数据
function create(req, res) {
const {uaccount} = req.body;
res.setHeader('Access-Control-Allow-Origin', '*'); // 添加跨域请求头
res.send ({
timestamp: 1111111111,
...req.body,
});
}
export default {
mock: false, // 这个参数代表关闭当前文件的mock
// 支持值为 Object 和 Array
'GET /api/users': { users: [1, 2] },
// GET POST 可省略
'/api/users/1': { id: 1 },
// 支持自定义函数,API 参考 express@4
'POST /api/users/create': create,
};
联调:当本地开发完毕之后,如果服务器的接口满足之前的约定,那么你只需要不开本地代理或者重定向代理到目标服务器就可以访问真实的服务端数据,非常方便
二、在umi中整合dva一起使用
1、安装umi-plugin-react插件
自>= umi@2起,把dva整合到umi中,可以直接通过
umi-plugin-react
插件来配置。这东西内置了react-dom
按目录约定注册 model,无需手动 app.model
文件名即 namespace,可以省去 model 导出的 namespace key
无需手写 router.js,交给 umi 处理,支持 model 和 component 的按