fetch请求如下（前段UI框架是antd）：
1.导航栏上点击Uers按钮，跳转至/users
<Menu.Item key="/users">
<Link to="/users"><Icon type="bars" />Users</Link>
</Menu.Item>
2.路由跳转控制
function RouterConfig({ history }) {
return (
<Router history={history}>
<Route path="/" component={IndexPage} />
<Route path="/users" component={Users} />
</Router>
);
}
3.上面的Users控件（component）如下
function Users({ location }) {
return (
<MainLayout location={location}>
<div className={styles.normal}>
<UsersComponent />
</div>
</MainLayout>
);
}
4.最终地址会跳转到一个fetch方法中，该方法会调用yield call来执行一个请求，具体如下
*fetch({ payload: { page = 1 } }, { call, put }) {
const { data, headers } = yield call(usersService.fetch, { page });
yield put({
type: 'save',
payload: {
data,
total: parseInt(headers['x-total-count'], 10),
page: parseInt(page, 10),
},
});
},
5.yield call方法里面的usersService.fetch方法如下（PAGESIZE目前是常量）
export function fetch({ page }) {
return request('/api/user/userList', {
method: 'POST',
headers: {
//'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8',
'Content-Type': 'application/json',
},
body: {
_page: { page },
_limit: { PAGE_SIZE },
},
});
// return request(`/api/user/userList?_page=${page}&_limit=${PAGE_SIZE}`);
}
6.request.js
import fetch from 'dva/fetch';
function parseJSON(response) {
return response.json();
}
function checkStatus(response) {
if (response.status >= 200 && response.status < 300) {
return response;
}
const error = new Error(response.statusText);
error.response = response;
throw error;
}
export default async function request(url, options) {
console.log(1232131);
console.log(options);
const response = await fetch(url, options);
// .then(checkStatus);
// checkStatus(response);
//
const data = await response.json();
const ret = {
data,
headers: {},
};
if (response.headers.get('x-total-count')) {
ret.headers['x-total-count'] = response.headers.get('x-total-count');
}
return ret;
}
7.后台springmvc接收数据的方法
//7.后台springmvc接收数据的方法
@Controller
@RequestMapping("/user")
public class UserController {
private static final Logger logger = LoggerFactory.getLogger(UserController.class);
@Autowired
private UserService userService;
@RequestMapping(value = "/userList")
//@ResponseBody
public void userList(final HttpServletRequest request, ModelMap modelMap) throws Exception{
String page = request.getParameter("_page");
String limit = request.getParameter("_limit");
List<CustBaseInfo> users = userService.getUserList(new CustBaseInfoExample());
modelMap.put("data", users);
}
}
备注：
1.如果fetch方法用的是GET请求，我把参数拼接在URL后面是没有问题的，后台可以接收到，但是这种情况下，后台如何将数据返回给dva框架，我现在是将返回结果users放在了modelmap当中，但前台还是获取不到数据
2.如果fetch是post请求，前台连数据都发不出，我是f12下看netWork就没有数据发送
