在使用Axios进行AJAX请求时,懒加载(lazy post)是一种常见的技术,它可以将AJAX请求推迟到用户需要请求数据的时候再触发,从而减轻服务器端的负担。下面是一段示例代码:
export function getList(url, params = {}) {
return function (dispatch) {
dispatch(requestStart());
axios.post(url, params).then((res) => {
dispatch(requestSuccess(res.data));
}).catch((err) => {
dispatch(requestFailure(err));
});
}
}
如果需要使用懒加载技术,我们需要在封装Ajax请求方法时将axios.post改为一个返回Promise对象的函数,然后不必在函数调用时就发起AJAX请求,而是在调用时返回Promise对象,然后在需要请求数据的时候调用该Promise对象的then方法发起AJAX请求即可。下面是改写后的示例代码:
export function getList(url, params = {}) {
return function (dispatch) {
dispatch(requestStart());
return () => axios.post(url, params);
}
}
// 如需使用懒加载,调用getList返回的函数时才会发送AJAX请求
getList('/api/list')().then((res) => {
console.log(res);
});
这样做可以实现懒加载请求,并且可以在调用getList方法时传递参数和请求配置。