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]
4060 questions
113
votes
7 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();
}
},
componentWillMount:…
alwaysLearn
- 6,882
- 7
- 39
- 67
95
votes
10 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
- 1,022
- 1
- 10
- 8
86
votes
10 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
- 1,013
- 1
- 7
- 13
72
votes
5 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,684
- 3
- 17
- 29
72
votes
7 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
- 865
- 1
- 6
- 8
69
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
- 20,677
- 15
- 82
- 117
57
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
- 16,456
- 10
- 90
- 156
50
votes
6 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,378
- 4
- 16
- 23
47
votes
8 answers
how to scale (large) font-awesome icons from the react-icons package
I am using the marvelouse react-icons package (http://gorangajic.github.io/react-icons/fa.html), specifically the font awesome package.
If this was not react, then I would just add an attribute to the tag, such as:
Dr.YSG
- 7,171
- 22
- 81
- 139
41
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
- 471
- 1
- 4
- 14
40
votes
2 answers
Why isn't the Formik `touched` property being populated?
I'm making a form with React, Formik, react-bootstrap, and yup for validation. I am trying to display validation errors, but the touched property is not being populated with the fields.
const schema = yup.object({
name: yup.string().required(),
…
djheru
- 3,525
- 2
- 20
- 20
40
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
- 13,682
- 4
- 19
- 23
38
votes
4 answers
Typescript/React what's the correct type of the parameter for onKeyPress?
Typescript 2.3.4, react 15.5.4 and react-bootstrap 0.31.0.
I have a FormControl and I want to do something when the user presses enter.
The control:
Shorn
- 19,077
- 15
- 90
- 168
37
votes
3 answers
Formik values not updating with state
Here's the template for a form I'm writing with Formik and react-bootstrap. I'm finding a very strange error: if I initialise my state with dummy data in the constructor, it works fine; but if I call setState with the exact same data in…
rwold
- 2,216
- 1
- 14
- 22
