ReactJS: Button Disappears onClick, Doesn’t Reappear Until User Clicks Somewhere Else on Screen

This dev tip is brought to you by the developer of MoneyPhone: Personal Expense Tracking for Android and iOS. Consistently spend less than you earn each month and get your finances under control when you start monitoring your expenses with MoneyPhone!

Woah there distraught ReactJS developer, fret not! If you have buttons in your ReactJS app disappearing after onClick events are fired, all you need to do is remove whatever 3rd party styling you are currently applying to your buttons, and then see what happens. In my case, the default RatchetCSS styling for “btn” classes was causing this wonky behavior in my app. However, all I had to do to fix things was remove this 3rd party class from my button, and everything started working as expected once again. Last, simply add your own styling back to your buttons and you should be back in business! (Also, if you happen to be using Bootstrap in your project and run into this problem, try using react-bootstrap instead.)

 

topherPedersen