title: Why e.preventDefault() does not work in React?
body: <p>Basic code below, yet the form submits and reloads. Why?</p>
  
  <pre><code>import React from 'react';
  
  class TestSubmitComponent extends React.Component {
      constructor(props) {
          super(props);
      }
  
  
      formSubmitHandler = (e) =&gt; {
          e.preventDefault(); //should prevent submit, and continue below?
          console.log(e);
  
          console.log('hello world ! why this does NOT show in console?!')
          return false;
      }
  
  
      render() {
          return(
              &lt;form method="POST" action="/"&gt;
                  &lt;div onSubmit={this.formSubmitHandler}&gt;
                      &lt;h1&gt;Select a file to upload&lt;/h1&gt;
  
                      &lt;input type="file" accept=".txt" name="ctlFileInput"&gt;&lt;/input&gt;
  
                      &lt;p/&gt;
                      &lt;input type="submit" value="Click to submit" /&gt;
                  &lt;/div&gt;
              &lt;/form&gt;
          )
      }
  }
  
  export default TestSubmitComponent;
  </code></pre>