@alicloud/console-base-rc-pagination/build/es/model/hook/use-effect-resize-observer.js

ConsoleBase 组件 - 分页

import { useMemo, useEffect } from 'react';
import useModelState from './_use-model-state';
import useDispatchSetWidth from './use-dispatch-set-width';

/**
 * 在 full 的时候，容易因宽度变化导致 UI 发生错乱，监听大小变化，必要的时候强行改 theme
 */
export default function useEffectResizeObserver() {
  var _useModelState = useModelState(),
    domUi = _useModelState.domUi;
  var dispatchSetWidth = useDispatchSetWidth();
  var resizeObserver = useMemo(function () {
    // https://developer.mozilla.org/en-US/docs/Web/API/ResizeObserver
    if (typeof ResizeObserver !== 'function' || !domUi) {
      return null;
    }
    return new ResizeObserver(function () {
      return dispatchSetWidth(domUi.getBoundingClientRect().width);
    });
  }, [domUi, dispatchSetWidth]);
  useEffect(function () {
    if (!domUi) {
      return;
    }
    if (resizeObserver) {
      resizeObserver.observe(domUi);
      return function () {
        return resizeObserver.unobserve(domUi);
      };
    }
  }, [domUi, resizeObserver]);
}