useMediaQuery

function useMediaQuery(query: string, disabled?: boolean): boolean;

The useMediaQuery hook can be used to access media queries and update functionality in React components.

Example Usage

import { useMediaQuery } from "@react-md/core/media-queries/useMediaQuery";

function Example() {
  const matches = useMediaQuery("screen and (min-width: 768px)");

  return <>{matches ? "Matches" : "Doesn't"}</>;
}

Parameters

query - The media query string that is passed to window,matchMedia
disabled - Prevent the media query from updating

Returns

true if the media query matches.

See Also