Document.ready functions with ReactJS

Question

I'm kinda new to ReactJS, learning and making one project. And i got stuck with such an issue.
I have app with authorization. User enters credentials and proceeds to app. There is a navigation menu made using external libraries. It slides up and down and initializes with something like

$(document).ready(function(){
  $('.menu-class').makeCoolMenu();
}); 

But, when user is not signed in - app not showing menu. This code runs and does nothing. After authorization menu appears, but of course not working.
I googled it, but found nothing about it. Just something about "dont use jquery with React". But what is the correct way to do such thing? Seems like i cant run

$('.menu-class').makeCoolMenu();

from within the application.

Thanks in advance.

Answer 1

Generally jquery is not needed in React app if you use it properly.

There are life hooks for React component that you can use to initialize something when content is loaded: https://www.fullstackreact.com/30-days-of-react/day-7/

Life hook that you need it ComponentDidMount that is fired when component is rendered first time.

Answer 2

I think your problem is how to integrate with other libraries like jQuery. You can follow this docs https://reactjs.org/docs/integrating-with-other-libraries.html