SOLVED React[ing] button troubles: how to disable a button in React

JavaScript
1

React is driving me up the wall! :slight_smile: (Not really, it’s fun to discover something new :sweat_smile::sweat_smile:)
I’m struggling with figuring out how to code a button that is disabled in React though.
Here’s the code I tried:

          <button className="fa fa-minus" onClick={this.props.decSession} disable/>

which unfortunately did nothing, so then I also tried setting disable=‘true’ but that also didn’t work.
I am failing to find any special reason in the React docs for this failure.
if you’d like to help me investigate, here’s my codepen, and thanks in advance!

Edit: gah! ‘disabled’ not ‘disable’!!!

2

You also typically send it a boolean value, not a string. A boolean in state or props.

Also it isn’t responding like a disabled button in terms of styling. Maybe your styling is overriding it. You can use conditional styling or class off the same boolean variable though

1 Like
3

I didn’t write anything specific to change the disabled styling, so something I’m doing must be ‘overriding’ that.
thanks again!