title: Javascript to update input is overwritten by placeholder
body: <p>I have a simple input box with a placeholder value. There is a simple function that updates its value</p>
  
  <pre><code>socket.on('barcode', function (data) {
      console.log('data received')
      console.log(data);
      var barcodeObj = document.getElementById("barcode")
      barcodeObj.value = data;
  })
  </code></pre>
  
  <p>I set a BP on this and the code actually inserts the barcode correctly just fine, however after checking that the function sets it correctly i continue running the app and then its quickly overwritten by the placeholder again.</p>
  
  <p>This is running ReactJS and there is an onChange event, but, I would expect that to fire off correctly just fine.</p>
  
  <p>the input is defined like this</p>
  
  <pre><code>    &lt;input
        type="text"
        id="barcode"
        placeholder="barcode.."
        value={this.state.barcode}
        onChange={this.handleBarcodeChange}
      /&gt;
  </code></pre>
  
  <p>And the handler is setup like so</p>
  
  <pre><code>handleBarcodeChange: function(e) {
      this.setState({barcode: e.target.value});
    }
  </code></pre>
  
  <p>which, isnt doing anything crazy.</p>
  
  <p>what am i missing here?</p>
  
  <p><strong>UPDATE:</strong></p>
  
  <p>I was able to get it working by injecting the  following code in to my DeviceForm react class.</p>
  
  <pre><code>componentDidMount: function () {
  var that = this;
  this.socket = io();     
  this.socket.on('barcode', function (data) {
        console.log('data received')
        console.log(data);
        that.setState({barcode: data});
    });
  </code></pre>
  
  <p>This is from this code <a href="http://code.runnable.com/VOIYIALkqgAnHDmj/node-js-socket-io-and-react-js" rel="nofollow">http://code.runnable.com/VOIYIALkqgAnHDmj/node-js-socket-io-and-react-js</a></p>