tdesign-react/lib/hooks/useElementLazyRender.js

TDesign Component for React

/**
 * tdesign v1.11.6
 * (c) 2025 tdesign
 * @license MIT
 */

import { _ as _slicedToArray } from '../_chunks/dep-889449c8.js';
import { useRef, useState, useEffect } from 'react';
import { o as observe } from '../_chunks/dep-4382179f.js';
import '../_chunks/dep-901cf2d8.js';

function useElementLazyRender(labelRef, lazyLoad) {
  var ioObserver = useRef();
  var _useState = useState(!lazyLoad),
    _useState2 = _slicedToArray(_useState, 2),
    showElement = _useState2[0],
    setShowElement = _useState2[1];
  var handleLazyLoad = function handleLazyLoad() {
    if (!lazyLoad || !labelRef.current || ioObserver.current) return;
    setShowElement(false);
    var io = observe(labelRef.current, null, function () {
      setShowElement(true);
    }, 10);
    ioObserver.current = io;
    return function () {
      var _ioObserver$current;
      if (!lazyLoad || !labelRef.current) return;
      (_ioObserver$current = ioObserver.current) === null || _ioObserver$current === void 0 || _ioObserver$current.unobserve(labelRef.current);
      ioObserver.current = null;
    };
  };
  useEffect(handleLazyLoad, [lazyLoad, labelRef]);
  return {
    showElement: showElement
  };
}

export { useElementLazyRender as default, useElementLazyRender };
//# sourceMappingURL=useElementLazyRender.js.map