How to use the @umijs/hooks.useSize function in @umijs/hooks

To help you get started, we’ve selected a few @umijs/hooks examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github leftstick / hosts-high / src / renderer / pages / index / index.js View on Github external
export default () => {
  const [state, ref] = useSize(document.body)
  return (
    <div style="{{">
      
      
    </div>
  )
}
github pingcap / tidb-dashboard / ui / dashboardApp / layout / main / Sider / Banner.tsx View on Github external
export default function ToggleBanner({
  fullWidth,
  collapsedWidth,
  collapsed,
  onToggle,
}) {
  const [bannerSize, bannerRef] = useSize()
  const bannerStyle = {
    opacity: collapsed ? 0 : 1,
    height: collapsed ? toggleHeight : bannerSize.height || 0,
  }
  const buttonStyle = {
    left: collapsed ? 0 : fullWidth - toggleWidth,
    width: collapsed ? collapsedWidth : toggleWidth,
  }

  const { data, isLoading } = useClientRequest((reqConfig) =&gt;
    client.getInstance().infoGet(reqConfig)
  )

  const version = useMemo(() =&gt; {
    if (data) {
      return parseVersion(data)
github pingcap / tidb-dashboard / ui / dashboardApp / layout / main / Sider / Banner.tsx View on Github external
export default function ToggleBanner({
  fullWidth,
  collapsedWidth,
  collapsed,
  onToggle,
}) {
  const [bannerSize, bannerRef] = useSize()
  const transBanner = useSpring({
    opacity: collapsed ? 0 : 1,
    height: collapsed ? toggleHeight : bannerSize.height || 0,
  })
  const transButton = useSpring({
    left: collapsed ? 0 : fullWidth - toggleWidth,
    width: collapsed ? collapsedWidth : toggleWidth,
  })

  const { data, isLoading } = useClientRequest((cancelToken) =&gt;
    client.getInstance().getInfo({ cancelToken })
  )

  const version = useMemo(() =&gt; {
    if (data) {
      return parseVersion(data)