0.1.11 • Published 4 years ago
dua v0.1.11
dua
dua是封装的基于dva的数据流,主要是为了统一model的数据结构,减少大量重复性的创建model相关的代码
使用之前
对后端的API有一些要求,这些要求可以让数据更加统一
- 后端返回的数据如果没有特殊的情况必须带上id字段
- 所有的PUT个POST请求返回修改后的全量数据
- 返回的数据保持统一的数据结构
单条数据
{
code: 200,
message: 'success',
data: {
id: '111',
xxx
}
}
多条数据
{
code: 200,
message: 'success',
data: {
list: [
{
id: '111',
xxx
}
],
total: 1
}
}
基础使用
- 定义model文件
import { create } from 'dua';
//可以换成其他的请求库
import request from 'umi-request';
export const fetchUser = () => request.get('/users');
const model = create('user', {
fetch: fetchUser,
});
export default {
namespace: 'user', //umi3会对model文件进行识别,umi2不需要这个
...model,
};
- 使用model
import React from 'react';
import { connect } from 'dva';
const Example = (props) => {
const { users, dispatch } = props;
React.useEffect(() => {
dispatch({
type: 'user/fetch',
});
}, []);
return (
<div>
{users.map(i => (
<div key={i.name}>{i.name}</div>
))}
</div>
);
};
export default connect(({ user }) => ({
users: user.allIds,
}))(Example);