I am trying to use the "UncontrolledCollapse" component from Reactstrap and have got issues, having it closing instantly on toggle.

Here's my code.

    constructor(props){
        super(props);
    }

    render() {
        return (
            <section className={'section'}>
                <img style={{position:'absolute',top:0,bottom:0,right:0,margin:'auto'}} height={'100%'} width={'auto'} src={header2}/>
                <Container className={'second-container-set'}>
                    <h2>
                        XXX
                    </h2>
                    <Row>
                        <Col xs="4">
                            <div id={'ARS'}>
                                <Card>
                                    <a href="https://www.occitanie.ars.sante.fr" target="_blank">
                                    <CardImg top width="50%" src={ars} alt="ARS"/>
                                    </a>
                                    <CardBody>
                                        <CardTitle className={'second-titre'}>Agence Régionale de Santé Occitanie</CardTitle>
                                        <UncontrolledCollapse toggler='#toggler'>
                                        <CardText>XXXXX</CardText>
                                        </UncontrolledCollapse>
                                    </CardBody>
                                    <Button color="primary" id='toggler' style={{ marginBottom: '1rem' }}>
                                        En savoir plus
                                    </Button>
                                </Card>
                            </div>
                        </Col>
                    </Row>
                </Container>
            </section>
        );
    }
}

I except the component to stay open until I re-click the button.

0 Answers