【react】通过PubSubJS插件实现token失效时回到登录页面

求库我用的axios，为了对axios封装所以建立了一个request.js，方便添加token和处理后端返回的状态码。
当后端返回的状态码为401，则表示token失效了，需要让用户重新登陆，但是由于使用的路由插件为react-router-dom v5版本，没有办法像vue一样直接在request里直接引用router，或使用history进行跳转，所以使用PubSubJS，利用事件的发布和订阅来完成退回登录页面的操作。

  npm install pubsub-js --save  // 安装插件
  import PubSub from 'pubsub-js' //引入
  PubSub.publish('delete', data) //发布消息
  PubSub.subscribe('delete', function(data){ }); //订阅

request.js

import axios from 'axios'
import { message } from 'antd';
import userInfo from "./userInfo";
import PubSub from 'pubsub-js'

let request = axios.create({
    baseURL:'http://xxxxxx:8099/',
    timeout:5000
})
//拦截响应
request.interceptors.response.use((response)=>{

        if (response.data && !response.data.status && response.data.code == 401) {
   			// 当状态码是401时，发布一个logout事件，第一个参数是自定义事件名，第二个是携带的参数
            PubSub.publish('logout', response.data.code);
            message.error(response.data.msg)
            throw new Error();
        }else if(response.data.code === 400 || response.data.code === 404){
            message.error(response.data.msg);
            throw new Error();
        }else if(response.data.code === 500){
            message.error(response.data.msg);
            throw new Error();
        }
        return response.data
    },function (error){
        message.error(error.data.msg)
        //对响应的错误做点什么
        return Promise.reject(error);
    }
)

export default request

监听logout事件

建议放在APP.js中。
不要使用一般函数，而要利用箭头函数的 this 指针是外层函数的this这一特性。

    // 渲染完成
    componentDidMount() {
        PubSub.subscribe('logout',(data)=>{
        	// 具体的退出操作
            this.props.history.replace('/login');
        })
    }