0

I am using Ionic 4 React and trying to make a simple chat application. When the user loads the chat page, I'd like to automatically start on the bottom of the page. What is the simplest way to do this?

Here is the code I have:

<IonPage>
        {/* Header */}
        <IonHeader>
            <IonToolbar>
            <IonButtons slot="start">
            <IonButton onClick={() => {
                setCurrentConversationId('')
                setState('home');
            }}
            fill="clear"  className="back-button" shape="round" size="default">
                <IonIcon slot="icon-only" icon={arrowBack} />
            </IonButton>
            </IonButtons>
            <IonTitle>Chat</IonTitle>
            </IonToolbar>
        </IonHeader> 

        {/* Content */}
        <IonContent>        
            {Object.values(messages).map((el, idx) => 
                printMessage(el, idx)
            )}
        </IonContent>

    </IonPage>
Adam Pahlavan
  • 1

1 Answers1

0

You can use .scrollToBottom() when loading of content is done. It's a method of ion-content.

Gustavo Kaneto
  • 643
  • 7
  • 17