0

tried

npm install --save bootstrap.native

loaded import 'bootstrap.native/dist/bootstrap-native-v4.js'; in index.js file in create-react app.

Expected Result: converting bootstrap component (navbar, modal, alert, popup...) to jsx and creating react component should work as expected in bootstrap v4.

Problem: Works when pasted directly in index.html but does not work when tried to render through component.

This shows bootstrap native is loaded properly, but it seems to be working only if bootstrap code is in DOM, but not on " create react app" rendered code.

Also any suggestion on, using bootstrap component as react component without use of jquery or any react-bootstrap library(something native implementation) will be welcome.

isherwood
  • 58,414
  • 16
  • 114
  • 157
rosnk
  • 1,068
  • 1
  • 14
  • 36
  • I would suggest that you build the things yourself, bootstrap uses a lot of classes to change things, for example I built this modal using the bootstrap classes but a custom react component https://codesandbox.io/s/hooks-modal-vs-class-modal-bdjf0. If you want to use bootstrap I would suggest to use it with jquery and take this article as a guide on how to do it https://reactjs.org/docs/integrating-with-other-libraries.html – jean182 Apr 06 '20 at 18:56
  • @jean182 - Bad advice does not work at all read my answer its about handling the DOM vs reacts virtual DOM – Codebreaker007 Apr 07 '20 at 21:40

1 Answers1

0

I am using BSN but not together with react:
Reason bootstrap.native uses the browser DOM, which is going to wreck havoc with React's virtual DOM. In short: Don't do it!

to say it more direct:
React is a whole different way of doing things. React support is out of scope for bootstrap.native. It would require a completely separate codebase.
Use react-bootstrap it is a complete rewrite of bootstrap.js (and also no jQuery)
From the developers:

React-Bootstrap replaces the Bootstrap JavaScript. Each component has been built from scratch as a true React component, without unneeded dependencies like jQuery

Codebreaker007
  • 2,911
  • 1
  • 10
  • 22