📦 nuqs@2.10.0 is out! 🚀
The React SPA adapter is now SSR-compatible for @astro.build, Inertia.js, @fastify.dev etc. Feed it the `serverSearch` prop to avoid a flash of defaults on island hydration.
Changelog: nuqs.dev/changelog#v2...
Try it out: pnpm add nuqs@latest
![import { useQueryState, parseAsNativeArrayOf, parseAsInteger } from 'nuqs'
const [projectIds, setProjectIds] = useQueryState(
'project',
parseAsNativeArrayOf(parseAsInteger)
)
// ?project=123&project=456 → [123, 456]
Demo:
?nativeArray=123&nativeArray=456&nativeArray=789
[123,456,789]](https://cdn.bsky.app/img/feed_thumbnail/plain/did:plc:bw4kguuz764ponbbn2aaycxk/bafkreigc4spz7pnbvvnki4zsegvq6tq5foypcrc2rptzaokg3obunzjsde)
![feat: multi-parsers #1134
PR by TkDodo
MultiParsers allow **key repetition** in the URL.
E.g.: with the built-in `parseAsNativeArrayOf`:
```ts
const [state] = useQueryState('key', parseAsNativeArrayOf(parseAsInteger))
// url: /?key=1&key=2&key=3
// state: [1, 2, 3]
```
Creating custom multi-parsers allow reducing the array of query values into more complex objects:
```ts
// /?kv=foo:bar&kv=baz:qux
{
foo: 'bar',
baz: 'qux'
}
```](https://cdn.bsky.app/img/feed_thumbnail/plain/did:plc:bw4kguuz764ponbbn2aaycxk/bafkreiakudkqqnomzxzor65qy6fgpjspxtejtxqjcr3priivkootchhjta)
![import { parseAsIndex } from "nuqs";
export function usePageIndex() {
const [pageIndex, setPageIndex] = useQueryState(
"page"
parseAsIndex.withDefault(0),
};
// URL is 1-indexed: /?page=1
// state is 0-indexed: pageIndex === 0
}](https://cdn.bsky.app/img/feed_thumbnail/plain/did:plc:bw4kguuz764ponbbn2aaycxk/bafkreia6gpypmywv37gkyxns2f5qb6hgrn67f6pktini4lgt27l3kzkgau)
