Nick
Nick
Explore posts from servers
SSolidJSTTCTheo's Typesafe Cult
PostsComments
SSolidJS
Created by Nick on 10/4/2024 in #support
Hydration errors with inline JSX
const EyeIcon = (props: { show: boolean }) => {
    const closedEye = (<svg/>/*omitted for brevity*/</svg>);
    const openEye = (<svg/>/*omitted for brevity*/</svg>);
    return (<Show when={props.show} fallback={closedEye}>
        {openEye}
    </Show>)
};
const EyeIcon = (props: { show: boolean }) => {
    const closedEye = (<svg/>/*omitted for brevity*/</svg>);
    const openEye = (<svg/>/*omitted for brevity*/</svg>);
    return (<Show when={props.show} fallback={closedEye}>
        {openEye}
    </Show>)
};
This gives me a hydration error with Astro. IF I extract the Open and Closed eye to their own components, it's all fine. Is this a bug, or am I misunderstanding something with regards to Solid (i.e. am I being React-Brained)?
2 replies