Component opening even if I block parameter by state

[Matt P]

I Have this two collapsible elements:

constructor(props) {
  super(props);
  this.state = {
    ContrattoOpen: true,
    DettaglioCorrispettiviOpen: false,
    contrattoSaved: false,
  };
}

 onOpenContratto() {
        this.setState({ ContrattoOpen: true, DettaglioCorrispettiviOpen: false });
    }

    onCloseContratto() {
        this.setState({ ContrattoOpen: false });
    }

    onOpenDettaglioCorrispettivi() {
        const { contrattoSaved } = this.state;

        if (!contrattoSaved) {
            this.setState({ ContrattoOpen: true, DettaglioCorrispettiviOpen: false }, () => {
                toast.info('Salvare il contratto prima di continuare');
                this.onCloseDettaglioCorrispettivi();
            });
            return;
        } else {
            this.setState({ ContrattoOpen: false, DettaglioCorrispettiviOpen: true });
        }
    }

    onCloseDettaglioCorrispettivi() {
        this.setState({ DettaglioCorrispettiviOpen: false });
    }

render() {
        const { ...props } = this.props;
        const { ...state } = this.state;
        return (
          // ...
            <Collapsible trigger="Contratto" open={state.ContrattoOpen} onOpening={this.onOpenContratto} onClosing={this.onCloseContratto}>
                      // ...
            </Collapsible>
            <Collapsible trigger="Dettaglio Corrispettivi" open={state.DettaglioCorrispettiviOpen} onOpening= {this.onOpenDettaglioCorrispettivi} onClosing={this.onCloseDettaglioCorrispettivi}>
                      // ...
            </Collapsible>
        );
}

Why when I check if !contrattoSaved then if not i set the second collapsibile state variable to false it opens itself anyway?

Thanks!

[Glenn Flanagan]

I'm not sure without being able to debug your code.

I suggest you add a debugger statement inside your onOpenDettaglioCorrispettivi to see what is going on.

I don't think this is an issue with the Collapsible so I suggest you ask the question over on Stack Overflow.

[Matt P]

I think I simply used the wrong props for my case.
I solved this issue using handleTriggerClick instead of onOpening and onClosing

for knowledge this is an example of the method i used:

   // triggered by handleTriggerClick
    onClickContratto() {
        const { ContrattoOpen } = this.state;
        const { ...props } = this.props;

        if (ContrattoOpen) {
            this.setState({ ContrattoOpen: false });
        } else {
            this.setState({ ContrattoOpen: true });
        }
    }