[useClickAway][Antd Input] 在 Antd Input 组件使用 useClickAway 页面报错

[justsso1]

报错：

最小可复现代码：

import { useClickAway } from 'ahooks';
import { Input } from 'antd';
import { useRef } from 'react';

const { TextArea } = Input;

const Comp = () => {
  const ref = useRef(null);

  useClickAway(() => {
    console.log('ClickAway');
  }, ref);

  return <TextArea ref={ref} />;
};

出错的代码位置是 packages/hooks/src/utils/getDocumentOrShadow.ts：

const checkIfAllInShadow = (targets: BasicTarget[]): boolean => {
  return targets.every((item) => {
    const targetElement = getTargetElement(item);
    if (!targetElement) return false;
    if (targetElement.getRootNode() instanceof ShadowRoot) return true; // 就是这里
    return false;
  });
};

使用原生的input元素是没有问题，但是使用 antd 的Input或者 TextArea 都会有问题。

[yangliguo7]

这里的 TextArea 的ref 的current 不是一个真实的dom 。所以解析失败了。

按这个修改下

return <div ref={ref}><TextArea /></div>