react 如何判断组件离开，或者手动控制组件的离开

Question

场景如下：现在用react实现了基于websocket的动态图形展示一个TabPanel组件里里有三个子的Tab组件，每个子组件一张动态图也就是每个组件一个websocket对应一张图已经实现websocket和图标展现但是当我切换tab，也就是切换图的时候，上一个tab所对应的websocket并没有关闭导致websocket的连接数随tab的切换增加，直到每个tab都有一个连接，且页面不刷新，即TabPanel不重新渲染，连接始终存在，数据量一大很影响页面效率我想做的是在每次切换tab的时候断开与前一个tab的websocket连接，每次切换都重新连接这样的话就要捕捉到tab组件的离开状态，如何在切换子组件的时候去手动控制上一个子组件中的信息？

Answer 1

试试在组件销毁阶段，断开连接。

componentWillUnmount() {   
 // 
 disconnect}