与react.js保持相同的socket.id

时间:2018-04-25 07:52:42

标签: javascript reactjs socket.io

我想在Chat类中使用相同的套接字。所以它有相同的socket.id。

但我无法找到如何将套接字提供给React中的另一个类。所以我的问题是如何在Chat类中使用相同的socket.id.

这是我现在的代码:



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>
);
&#13;
<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>
&#13;
&#13;
&#13;

&#13;
&#13;
class Chat extends React.Component {
  constructor(props) {
    super(props);
    
    var socket = io('localhost:5000');
  }
}
&#13;
<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>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

你能否将io移出自己的文件?

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

并在文件中使用

import { socket } from "./socket";