关于react中请求拦截,拦截到的信息如何在页面显示
订阅发布者模式在react中实现,当我们请求失败或者请求发生错误,我们需要输出错误,错误最好的输出位置就是在我们的请求拦截输出,然而我们拦截请求文件是格式是ts,在ts文件中我们没办法做到渲染数据到页面中,这个时候就需要用到定订阅发布模式,订阅方法是on,发布方法是emit。首先我们需要有一个发布者emit,来接收我们后端返回的错误提示,我们设置一个key值来接收这个错误,然后在我们订阅的组件使用on来接收发布者传过来的错误提示,这个订阅者是使用key来接收传过来的信息的,然后用callback来输出传过来的错误提示,来实现发布订阅模式,这样就能做到在请求拦截捕获到错误信息,然后在组件中输出我们的错误方法了,达到提示的功能。
关于发布订阅者模式封装。
on事件的封装思路,判断事件名称是否存在,如果存在的情况下,可以把我们接收过来的数据存放到数组里,如果不存在则是我们创建key值为eventname,value为值的数组。
emit 的封装思路,每当我们调用时候会获取到一个值,,我们可以对值进行判断,如果不存在的话,直接return,如果存在的话可以遍历这个值全局进行调用,并赋值给我们的value发布者模式还有观察者模式之间的区别,首先是流程区别,观察者模式数据只是在观察者还有观察目标传递,然而发布者模式的流程中会有一个中央事件总线,任何发布订阅模式都要经过这个中央数据总线,,他们最大的区别就是一个有中央事件总线一个没有。
缺点
发布订阅者模式可以将许多需要通讯的组件解耦,每个子系统独立管理,即便是部分的子系统取消订阅,也是不会影响到事件总线的。事件总线可以确保将消息传递到每个订阅者手里。保持引用在增加负载的情况下平稳运行,更有效的处理故障,不想要关心其他组件,只需要遵守一份协议就行,缺点是创建订阅者本身会消耗内存,如果没有发布会造成内存泄漏,创建需要消耗一定的时间和内存,过度使用会导致代码不好维护。