title: How to update the value coming from web socket server in React.js?
body: <p>I'm new to React and was trying to set and then update the value from a websocket object in javascript to render it to the interface using React.</p>
  
  <p>Below is the whole javascript code I'm using. I tried using the <code>componentDidMount()</code> and <code>componentWillMount()</code> methods in React but nothing seems to work.</p>
  
  <p>Can anybody please tell how it can be done ? The value coming is constantly changing. I have added the code that I was experimenting with below but this also doesn't seem to work. If any similar solution for the same will also be helpful.</p>
  
  <pre><code>var client = new WebSocket('ws://localhost:8000/','echo-protocol');
          var val =null;
  
                 client.onerror = function() {
                     console.log('Connection Error');
                 };
  
                 client.onopen = function() {
                    function sendNumber() {
                         if (client.readyState === client.OPEN) {
                             var number = Math.round(Math.random() * 0xFFFFFF);
                             client.send(number.toString());
                             setTimeout(sendNumber, 1000);
                         }
                     }
                     sendNumber();
                 };
  
                 client.onclose = function() {
                     console.log('echo-protocol Client Closed');
                 };
          /*
                 client.onmessage = function(e) {
                     if (typeof e.data === 'string') {
                          val=e.data;
                       console.log("Received: '" + val + "'");
                     }
                 };
  
              */
  
                 var ReceivedData = React.createClass({
                    getInitialState: function() {
                       return { value : [] };
                    },
  
                    componentDidMount: function() {
                        client.onmessage = function(e) {
                             if (typeof e.data === 'string') {
                                  this.setState({
                                      value: e.data
                                  })
                             }
                         };
                        },
  
                    render: function() {
                          return (React.createElement("div",this.state.value))
                      }
               });
  
              ReactDOM.render(React.createElement(ReceivedData,null), document.getElementById("container"));
  </code></pre>