title: How to add disabled attribute via prop to a button in react?
body: <p>I am creating a custom button component in react. I want to pass a prop to that button, based on the value of which button gets enabled or disabled.</p>
  
  <p>My problem is 
  - The mere presence of the disabled property disables the element, so I cannot set its value as "false". Even the following code is disabling the element</p>
  
  <pre><code>&lt;input type="button" id="myBtn" value="Submit" disabled="" /&gt;
  </code></pre>
  
  <p>I need to either remove the attribute completely or set its property via javascript.</p>
  
  <pre><code>document.getElementById("myBtn").disabled = true;
  </code></pre>
  
  <p>My custom button component is - </p>
  
  <pre><code>import React from 'react';
  
  const CustomButton = ({ whenClicked, classNames, buttonText, isDisabled }) =&gt;
      (
          &lt;button
              onClick   = {whenClicked}
              className = {`btn ${classNames}`}
              type      = "button"
              disabled  = {isDisabled}
          &gt;
             {buttonText}
          &lt;/button&gt;
      );
  
  export default CustomButton;
  </code></pre>
  
  <p><code>isDisabled</code> is a boolean value.</p>
  
  <p>One more thing, I lost the default submit behavior of button while using custom button. Now I always need to pass a click handler. Is there any way to achieve the same behavior again?</p>