Open JeroenMoonen opened 1 year ago
When navigating to a specific page using routerLink, everything goes well. When manually refreshing the page, I get an Hydration error. How do I solve this issue?
routerLink
The error:
The content of the page, where the Hydration error occurs:
import { IonBackButton, IonButton, IonButtons, IonContent, IonHeader, IonPage, IonTitle, IonToolbar, } from '@ionic/react'; import React from 'react'; export default function Schedule(): React.JSX.Element { return ( <> <IonPage> <IonHeader> <IonToolbar color="light"> <IonButtons slot="start"> <IonBackButton defaultHref="/"></IonBackButton> </IonButtons> <IonTitle>Schedule</IonTitle> <IonButtons slot="end"> <IonButton routerLink="/booking/create">Create</IonButton> </IonButtons> </IonToolbar> </IonHeader> <IonContent className="ion-padding" color="light" role="feed"> <h2>Lorem ipsum</h2> <p className="medium grey">Dolor sit amet.</p> </IonContent> </IonPage> </> ); }
Having the exact same error with ion-toolbar. Anyone find a solution yet?
When navigating to a specific page using
routerLink
, everything goes well. When manually refreshing the page, I get an Hydration error. How do I solve this issue?The error:
The content of the page, where the Hydration error occurs: