React components that automatically calculate width and height

简体中文 | English

🏠 Homepage

📦 Install

  yarn add @oyyds/react-auto-sizer  # or npm i @oyyds/react-auto-sizer -S

🔨 Use

import AutoSizer from '@oyyds/react-auto-sizer';

const AutoSizeComponent = () => {
  return (
    <div>
      <AutoSizer>
        {({ width, height }) => (
          <div
            style={{
              width,
              height,
            }}
          >
            Content area
          </div>
        )}
      </AutoSizer>
    </div>
  );
};

🦧 Author

• Website: https://juejin.cn/user/4318537404123688/posts
• Github: @niexq

🤝 Contributing

Contributions, issues and feature requests are welcome!Feel free to check issues page.

❤️ Show your support

Give a ⭐️ if this project helped you!

📝 License

This project is MIT licensed.

🐳 Link

react-virtualized-auto-sizer ResizeObserver

🌐 Browsers support

| Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox Android | Opera Android | Safari iOS | Samsung Internet | | :-: | :-: | :-: | :-: | :-: | :-: | :-: | :-: | :-: | :-: | :-: | :-: | | 64 | 79 | 69 | ❌ | 51 | 13.1 | 64 | 64 | 79 | 47 | 13.4 | 9.0 |