react-window-size-hooks

!CI Status

> React hooks to get the window size.

Install

npm

``bash
$ npm i react-window-size-hooks
`

yarn

`bash
$ yarn add react-window-size-hooks
`

Usage

`js
import React from 'react';
import { useWindowSize } from 'react-window-size-hooks';

export const ShowWindowSize = () => {
const { width, height } = useWindowSize();
// do something
};
`

$3

`js
import React from 'react';
import { useWindowWidth, useWindowHeight } from 'react-window-size-hooks';

export const ShowWindowSize = () => {
const width = useWindowWidth();
const height = useWindowHeight();
// do something
};
`

$3

Set an arbitrary initial value.
If not set, the size is 0.

`js
import React from 'react';
import { useWindowSize } from 'react-window-size-hooks';

export const ShowWindowSize = () => {
const { width, height } = useWindowSize({
width: 800,
height: 600,
});
// do something
};
``

FAQ

$3

33ms. It's about 30FPS.

$3

- Only one resize event is registered, even if used in multiple locations.
- Throttling is also done in one place, which is efficient.
- Supports TypeScript.

Contribution

If you find a bug or want to contribute to the code or documentation, you can help by submitting an issue or a pull request.

License

MIT