SSRProvider

When using SSR with React Aria, applications must be wrapped in an SSRProvider. This ensures that auto generated ids are consistent between the client and server.

installyarn add react-aria
version3.19.0
usageimport {SSRProvider} from 'react-aria'

Introduction#


SSRProvider should be used as a wrapper for the entire application during server side rendering. It works together with the useId hook to ensure that auto generated ids are consistent between the client and server by resetting the id internal counter on each request. See the server side rendering docs for more information.

Props#


NameTypeDefaultDescription
childrenReactNodeYour application here.

Example#


import {SSRProvider} from 'react-aria';

<SSRProvider>
  <YourApp />
</SSRProvider>
import {SSRProvider} from 'react-aria';

<SSRProvider>
  <YourApp />
</SSRProvider>
import {SSRProvider} from 'react-aria';

<SSRProvider>
  <YourApp />
</SSRProvider>