diff --git a/README.md b/README.md index 90090fa..0f6c6c2 100644 --- a/README.md +++ b/README.md @@ -119,6 +119,28 @@ If you're curious about how react-media differs from [react-responsive](https:// Enjoy! +### `defaultMatches` prop for server-side rendering + +This component comes with a `defaultMatches` prop and its default is set to true. + +When rendering on the server you can use the `defaultMatches` prop to set the initial state on the server to match whatever you think it will be on the client. You can detect the user's device by analyzing the user-agent string from the HTTP request in your server-side rendering code. + +``` +initialState = { + device: 'mobile' // add your own guessing logic here +}; + +