bier hier bier hier - 1 year ago 69
React JSX Question

How can I open the collapsing div through prop?

I have a react-bootstrap Collapse that should open/close when clicking the button. I also want to open it through a redux dispatch but for simplicity I am passing a property with a bool value:

<App opennow={true} />

This is part of the render method in my Appcomponent:

render() {
console.log('opennow', this.props.opennow)

// = this.props.opennow;
return (
<Button onClick={
this.setState({ open: ! })
<Collapse in={}>

How can I keep the existing show/hide functionality and trigger a show ie open the Collapse through a property in this case this.props.opennow? Here is a Codepen

Answer Source

Add a componentDidMount in your class. It runs code after the DOM has been generated.


If the opennow prop is passed as true it checks the condition and sets the open to true in the state.

Here's the codepen

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download