useMedia

Matches a CSS media query and reactively updates when the viewport changes.

Tracks whether a CSS media query matches the current viewport and reactively updates when conditions change. Supports a default state for server-side rendering environments.

Import#

import { useMedia } from '@volue/wave-react';

Example#

useMedia uses window.matchMedia underneath, so provide a default state for server-side rendering where window.matchMedia is not available.

API reference#

Arguments#

Prop	Type	Default
`query`*	`string`	`—`
`defaultState`	`boolean`	`—`

Returns#

boolean