title: How to use jsx-control-statements in reactjs?
body: <p>Im using jsx-control-statements in react app to add basic control statements. I've installed the same using npm and updated the .babelrc file as below</p>
  
  <pre><code>{
    "presets": ["react"],
    "plugins": ["jsx-control-statements"]
  }
  </code></pre>
  
  <p>and I've the below jsx code</p>
  
  <pre><code>&lt;IF condition={ selectedID !== null }&gt;
   {this.renderData()}
  &lt;/IF&gt;
  </code></pre>
  
  <p>below is the function to initiate the selectID, I want to execute the renderData() only if the value not equal to null</p>
  
  <pre><code>getInitialState() {
      return {
          selectedID: null
      }
  },
  </code></pre>
  
  <p>As of now Im getting a console error saying "Uncaught ReferenceError: IF is not defined" and the app is not loading. Can anyone tell me anything wrong here. Need help.</p>