Questions tagged [reactstrap]

Stateless React Components for Bootstrap 4.

React Bootstrap 4 components that favor composition and control. The library does not depend on jQuery or Bootstrap javascript. However, Poppers.js via react-popper is relied upon for advanced positioning of content like Tooltips, Popovers, and auto-flipping Dropdowns.

The library documentation can be found in github.

778 questions
0
votes
0 answers

ReactJS defaultChecked in multiple checkboxes with reactstrap

I found out defaultChecked in multiple checkboxes is quite slow to render. let data1 = this.props.data1 let data2 = this.props.data2 let renderData = data1.map((item, index)=>{ let defaultChecked = false if ( data2.length != 0 ) { …
Alan Yong
  • 993
  • 2
  • 12
  • 25
0
votes
1 answer

CSS-In-Js Using aphrodite style object with string class names on one html element

My existing project using Bootstrap and looks like:
0
votes
1 answer

Showing Modal as normal div - Reactstrap

I have a Reactstrap Modal: Modal - Reactstrap I would like to use this modal as a I would use a "normal" div in a page layout. I.E. Show the modal inside the page with the same design, just without it popping in and out, and blurring the rest of the…
Poogy
  • 2,597
  • 7
  • 20
  • 35
0
votes
2 answers

In reactstrap how do I get parameters through to the Jumbotron from a calling component?

I think I need to use the tag parameter to allocate props to the Jumbotron but I don't understand the syntax given on the reactstrap components page. Jumbotron.propTypes = { // Pass in a Component to override default element tag:…
0
votes
1 answer

React-strap renaming components

In React-strap, components have the name 'Example' by default. Can someone explain to me why I get the below duplicate error, Module build failed: D:/workspace/html5/rnd/react/scotch-io-routing-react/src/bsp/nav.component.jsx: Duplicate…
0
votes
1 answer

Problems Importing Bootstrap Studio Renders into React with reactstrap

I'm working on a project where the designer is working with BootStrap studio, which exports to html with BootStrap 4, and I'm converting the exported file into React components with reactstrap. I'm facing problems with class and styling rules, since…
haeli05
  • 21
  • 1
  • 3
0
votes
1 answer

React-Router with Reactstrap results in warning

I have a navbar with a brand, and I want the brand to be a link to the main page. import { NavLink } from "react-router-dom"; . . .
Poogy
  • 2,597
  • 7
  • 20
  • 35
0
votes
1 answer

Passing custom props in link

I am trying to figure out how to pass custom prop in NavLink.I am using Server side rending and reactstrap. The flow is I get the list of data from backend and create Navlinks for it.When user will click on the Navlinks instead of again getting the…
0
votes
2 answers

How do I pass arguments from a child function to a parent reactjs

I have created a simple app component which renders a side bar and a dashboard. On a link click within the sidebar, I want to do an AJAX request and change the state of the dashboard. I have moved the click handler function to the index.js app…
user5948213
0
votes
0 answers

Can I use React-Router to render a component within an opened modal?

I am trying to build a log in/sign up interface using Reactstrap (React components for Bootstrap v4) and React-Router. I have the sign in and sign up buttons available on a modal. Once a user clicks either "sign in" or "sign up", I would like that…
user8891334
  • 171
  • 1
  • 4
  • 10
0
votes
0 answers

ReactsTrap is not rendering my Modal

components: Catalog reactstrap version #4.8.0 react version #16.2.0 bootstrap version #4.0.0 What is happening? Modal is not rendering in my HTML -> inspecting it shows nothing. creates error on toggling. What should be happening? Modal should be…
DTul
  • 646
  • 6
  • 21
0
votes
2 answers

passing value to progress bar in React and Reactstrap

I've never used a progress bar, so I am trying to figure out by piecing together various sources and trying to get it to work with React and Reactstrap. This is what seemed to make sense to me, but it isn't working. This is the documentation for…
cjones
  • 8,384
  • 17
  • 81
  • 175
0
votes
0 answers

Use options to filter data inside of a table with React

So basically I'm working with a large dataset that gives you a list of videos (about 100-200) for each day in this year (2018, so the data is from January 1st, 2018 to February 18th, 2018). What I want to do is use a table to show all of the videos…
fairlyMinty
  • 413
  • 8
  • 22
0
votes
1 answer

reactstrap install from github

I want the latest commit in reactstrap in my react/redux app. I have added it to my package.json as so: "dependencies": { "reactstrap": "git@github.com:reactstrap/reactstrap.git#24951541a110451c167ff53e6ebb367972717bc5", } It seems to install…
BC00
  • 1,589
  • 3
  • 29
  • 47
0
votes
2 answers

Keep navigation bar on route switch

I have a problem with my react components. Basically my interface should be an SPA, built with ReactJS. During the implementation of the authentication with auth0-js I also implemented some routes. The layout looks like this: Whenever I click now…
bash0ne
  • 394
  • 3
  • 14