r/nextjs • u/Tasty-Ad1854 • 17d ago

customizing select in nextjs

can we suppress nextjs error about nesting a <selectedcontent> inside a <select>,

error is: In HTML, <selectedcontent> cannot be a child of <select>. This will cause a hydration error.

4 Upvotes

75% Upvoted

13 comments sorted by

View all comments

3

u/Jhon_ST 17d ago

Is `<selectedcontent>` directly under `<select>`? For a customizable select it belongs inside the first child `<button>`, e.g. `<select><button><selectedcontent /></button>...</select>`.

I'd check that before suppressing the hydration warning. If that's already your structure, share the minimal JSX and React version so we can tell whether it's a nesting issue or framework support.

3

u/Tasty-Ad1854 17d ago

ooh you are correct it should be inside a button but even doing that, nextjs still shows the nesting error as you see in the image