react多个网络请求_为react网络请求提示写一个小插件

网络请求出现的各种提示

import axios from "axios";

import store from "./store.js";

import {setIsLoading} from "./action.js";

import { message } from 'antd';

function get(url,params){

// 开启加载指示器

store.dispatch(setIsLoading(true));

return axios.get(url,{

params

})

.then(res=>{

store.dispatch(setIsLoading(false));

if(res.data.err){

message.error(res.data.msg);

}else{

message.success(res.data.msg);

}

return Promise.resolve(res);

})

.catch(err=>{

store.dispatch(setIsLoading(false));

message.error("网络故障");

})

}

function post(url,params,config){

store.dispatch(setIsLoading(true));

return axios.post(url,params,config)

.then(res=>{

store.dispatch(setIsLoading(false));

if(res.data.err){

message.error(res.data.msg);

}else{

message.success(res.data.msg);

}

return Promise.resolve(res);

})

.catch(err=>{

store.dispatch(setIsLoading(false));

message.error("网络故障");

return Promise.reject(err);

})

}

export {

get,

post

}

action中

function setIsLoading(v){

return {

type:"SET_IS_LOADING",

value:v

}

}

export {

setIsLoading

}

同步action中

function setUserInfo(v){

return {

type:"SET_USER_INFO",

value:v

}

}

异步action一般用于网络请求

import {get,post} from "./http.js"

import {setUserInfo} from "./action.js"

// 登录请求

function queryLogin(params){

return function(dispatch){

return post("/user/login",params)

.then(res=>{

// 异步action请求成功，dispatch到同步antion修改仓库数据

dispatch(setUserInfo(res.data.userInfo));

return Promise.resolve(res);

})

}

}

// 判断是否登录请求

function queryIsLogin(params){

return function(dispatch){

return get("/user/islogin")

.then(res=>{

dispatch(setUserInfo(res.data.userInfo));

return Promise.resolve(res);

})

}

}

export {

queryLogin,

queryIsLogin