Сохраняйте тот же сокет с помощью response.js

Question

Я хочу использовать тот же сокет в классе Chat. Так что у него такой же socket.id.

Но я не могу найти, как передать сокет другому классу в React. Поэтому мой вопрос: как я могу иметь такой же socket.id в классе Chat?

Теперь это мой код:

class Website extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      showComponent: false,
    };

    var socket = io('localhost:5000');

    this.handleClick = this.handleClick.bind(this);


  }

  handleClick() {
    this.setState(function(prevState) {
      return {
        isToggleOn: !prevState.isToggleOn
      };
    });

  }
  render() {
      return ( <
          div >
          <
          button onClick = {
            this.handleClick
          } > Test < /button> {
          this.state.isToggleOn ?
          <
          Chat / > :
          null
        } <
        button onClick = {
          this.handleClick2
        } > Service Desk < /button> {
      this.state.isToggleOn2 ?
        <
        ServiceDesk / > :
        null
    } <
    /div>
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

class Chat extends React.Component {
  constructor(props) {
    super(props);
    
    var socket = io('localhost:5000');
  }
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>

Answer 1

Не могли бы вы переместить это io в отдельный файл?

// socket.js
export const socket = io('localhost:5000');

И использовать его в файлах

import { socket } from "./socket";