Ionic 4 + React: How Can I close an IonItemSliding?

Ionic Framework
1

How can I close an IonItemSliding programatically?

I have an IonItemSliding and when the user select an option I need close ten item after I run the process

<IonItemSliding key={props.atleta.codigo}>
            <IonItem >
                <IonAvatar slot="start">
                    <img src={foto} />
                </IonAvatar>
                <IonLabel>
                    {props.atleta.nombre}
                    <IonText color="primary">
                        <h3>{props.atleta.email}</h3>
                        <p>Desde:{new Date(props.atleta.fechadesde).toLocaleDateString()}<span> Hasta:{new Date(props.atleta.fechahasta).toLocaleDateString()}</span></p>
                    </IonText>
                    
                    <IonText color={colorEstatus(props.atleta.fechahasta)}>
                        <p>{estatus(props.atleta.fechahasta)}</p>
                    </IonText>
                </IonLabel>
            </IonItem>
            
            <IonItemOptions side="end">
                <IonItemOption onClick={props.onAplicarCreditos.bind(this)}>Aplicar Créditos</IonItemOption>
            </IonItemOptions>
        </IonItemSliding>

In the onAplicarCreditos function I like close the item.

2 
await document.querySelector("ion-item-sliding").closeOpened();
4 Likes
3

Also you can do:

const ref = useRef(null):

<IonItemSliding key={props.atleta.codigo} ref={element => {
  ref.current = element;
}}>

And then later:

ref.current.close();
3 Likes
4

Worked for me. Two for two with your suggestions. Thanks!

1 Like
5

I have been doing this for a while, you should checkout my YouTube there is a lot of ionic content there Aaron Saunders - YouTube

6

After you responded and I was searching something, I found you and subscribed to your channel.