I am trying to use Bootstrap modal inside React. I have successfully opened a modal. For closing the modal programatically, I am using the below code.
$('#exampleModal').modal('hide')
The code is written inside the onClick event of a button. When I click the button, I am getting the error Unhandled Rejection (TypeError): jquery__WEBPACK_IMPORTED_MODULE_6___default(...)(...).modal is not a function
I have imported Bootstrap and jQuery as below.
import 'bootstrap';
import $ from 'jquery';
How to fix this? How can I use jQuery inside React to close the modal?
Use react-bootstrap and try to avoid JQuery while working with React. Because JQuery is at a bit different level than React internals, if I can put it this way.
In this example you can see how it can be handled within component state to show modal:
https://react-bootstrap.github.io/components/modal/#modals-live