Bootstrap components built with ReactJS, for ReactJS applications
Allows ReactJS application developers to easily render Twitter Bootstrap 3 Components in their own ReactJS Components
Questions tagged [react-bootstrap]
2931 questions
88
votes
9 answers
React-Bootstrap link item in a navitem
I'm having some styling issues using react-router and react-bootstrap. below is a snippet of the code
import { Route, RouteHandler, Link } from 'react-router';
import AuthService from '../services/AuthService'
import { Button, Nav, Navbar,…
chad schmidt
- 952
- 1
- 8
- 8
88
votes
6 answers
Listen to keypress for document in reactjs
I want to bind to close the active react bootstrap popover on escape press .Here is the code
_handleEscKey:function(event){
console.log(event);
if(event.keyCode == 27){
this.state.activePopover.hide();
}
},
…
alwaysLearn
- 6,426
- 6
- 33
- 63
60
votes
4 answers
What is difference between reactstrap and react-bootstrap?
I found two different bootstraps for reactjs
npm install --save reactstrap react react-dom
npm install react-bootstrap bootstrap
What is the basic and main difference between both?
Pallav Raj
- 1,464
- 3
- 15
- 27
49
votes
4 answers
Advantages of using react-bootstrap over bootstrap
What's the point in using react-bootstrap over plain old Bootstrap?
I was going through https://react-bootstrap.github.io/components.html and I don't see any advantage. I can only see that it can bring unnecessary dependency to the project.
Is…
Amio.io
- 17,083
- 11
- 66
- 100
47
votes
2 answers
Styled-components and react-bootstrap?
Is there a way to use styled-components together with react-bootstrap? react-bootstrap exposes bsClassproperties instead of className for their component which seems to be incompatible with styled-components.
Any experiences?
jpfollenius
- 15,826
- 9
- 83
- 148
38
votes
6 answers
ReactJS Bootstrap Navbar and Routing not working together
I am trying to create a simple Webapp using ReactJS, and I wanted to use the Navbar provided by React-Bootstrap.
I created a Navigation.js file containing a class Navigation to separate the Navbar and the Routing from the App.js file. However, both…
NotAName
- 515
- 1
- 4
- 7
34
votes
8 answers
How to get select element's value in react-bootstrap?
So I'm trying to get a select element's value in reactjs, but just can't figure it out. The this.refs.selectElement.getDOMNode().value is always coming as undefined. All other controls on the form like text are working fine. Any ideas? Is it that…
Raza Gill
- 1,132
- 4
- 12
- 23
30
votes
6 answers
Changing style of a button on click
Is it possible to change background-color of my button onClick function?
ex. click background-color: black, another click background-color: white
I've tried something like this.style, no result.
I've managed to get overlay working and insert needed…
user3350597
- 351
- 1
- 3
- 14
30
votes
4 answers
How to set z-index on a component?
Tried using the 'zindex' prop, as suggested here:
https://github.com/facebook/react/issues/1456
Doesn't work. Also tried 'zindex="1"'
Any ideas?
Robert Kovačević
- 1,178
- 4
- 15
- 23
29
votes
5 answers
Enter key event handler on react-bootstrap Input component
I have an Input component with a button (buttonAfter property), I set an onClick handler associated to the button and so user can type some text and clic the button to fire the right action.
However, I would like user to be able to press [Enter]…
mguijarr
- 6,884
- 4
- 37
- 67
28
votes
9 answers
How do I create a dynamic drop down list with react-bootstrap
The example code in the react-bootstrap site shows the following. I need to drive the options using an array, but I'm having trouble finding examples that will compile.
JohnL
- 11,126
- 4
- 17
- 20
26
votes
6 answers
How to fix this error : " Module not found :can't resolve popper.js "
After import the Bootstrap and Jquery this error is showning when compiling.
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import 'bootstrap/dist/css/bootstrap.css';
import './index.css';
global.jQuery =…
Ranindu
- 381
- 1
- 3
- 9
26
votes
7 answers
How to get an input value using "refs" in react-bootstrap form?
I'm trying to create a form that appears in modal. So when user input a value, that value is stored in local storage. Here's a picture that help's you to understand what I mean:
Here is the code of the form:
function FieldGroup({id, label, help,…
Taras Yaremkiv
- 3,205
- 6
- 25
- 48
26
votes
4 answers
How to open/close react-bootstrap modal programmatically?
I need to open/close modal like
$(element).modal('show')
How to do that?
Igor Babkin
- 469
- 2
- 6
- 14