title: React Material-ui button disabled property not working
body: <p>I can't make the property [disabled] for my material-ui button work.</p>
  <p>Props are coming from the parent component, it's mainly strings.
  Deck is an array of cards.</p>
  <p>Here's my code :</p>
  <pre><code>import React from &quot;react&quot;;
  import Button from &quot;@material-ui/core/Button&quot;;
  import AddIcon from &quot;@material-ui/icons/Add&quot;;
  
  export default class Card extends React.Component {
    state = {...};
  
    addToDeckClick = (event) =&gt; {
      event.stopPropagation();
      this.addToDeck();
      this.toggleShowDescription();
    };
  
    isCardInDeck = () =&gt; {
      return this.props.deck.some(
        (card) =&gt; card.translationKey === this.props.card.translationKey
      );
    };
  
    addToDeck = () =&gt; {
      if (!this.isCardInDeck()) {
        this.props.deck.push(this.props.card);
      }
    };
  
    isAddButtonDisabled = () =&gt; {
      return !this.isCardInDeck();
    };
  
    render() {
      return (
            ...
            &lt;Button
              disabled={this.isAddButtonDisabled()}
              className=&quot;addDeck&quot;
              variant=&quot;contained&quot;
              color=&quot;primary&quot;
              onClick={this.addToDeckClick}
              startIcon={&lt;AddIcon /&gt;}
            &gt;
              Add to deck
            &lt;/Button&gt;
            ...              
       );
    }
  }
  </code></pre>
  <p>I tried several syntaxes :</p>
  <pre><code>disabled={this.isAddButtonDisabled}
  disabled={this.isAddButtonDisabled()}
  disabled={() =&gt; this.isAddButtonDisabled()}
  </code></pre>
  <p>But can't make it work. Any ideas ?...</p>