在react中重新连接websocket的最佳实践是什么？

import React, { Component } from 'react';

class WebSocketComponent extends Component {
  constructor(props) {
    super(props);
    this.websocket = null;
    this.reconnectTimer = null;
  }

  componentDidMount() {
    this.connectWebSocket();
  }

  componentWillUnmount() {
    this.closeWebSocket();
  }

  connectWebSocket() {
    this.websocket = new WebSocket('ws://example.com');

    this.websocket.onopen = () => {
      console.log('WebSocket connected');
      // 可以在连接成功后执行其他逻辑
    };

    this.websocket.onclose = () => {
      console.log('WebSocket disconnected');
      // 设置定时器，在一定时间后尝试重新连接
      this.reconnectTimer = setTimeout(() => {
        this.connectWebSocket();
      }, 5000);
    };

    this.websocket.onerror = (error) => {
      console.error('WebSocket error:', error);
    };
  }

  closeWebSocket() {
    if (this.websocket) {
      this.websocket.close();
      this.websocket = null;
    }

    if (this.reconnectTimer) {
      clearTimeout(this.reconnectTimer);
      this.reconnectTimer = null;
    }
  }

  render() {
    return (
      <div>
        {/* WebSocket相关的组件内容 */}
      </div>
    );
  }
}

export default WebSocketComponent;