小编swi*_*_js的帖子

我正在编写一个组件，该组件state根据ref其子对象处理一些内部事件（例如，与该子对象的ref相关的鼠标事件）。
该组件使用a render-prop传递相关state子对象的子元素，并ref通过React.cloneElementutil 渲染带有附加子元素的子元素。

问题是，当子级是一个class组件时，由于某种原因该子级ref不可用，并且由于它是一种类型为react element的对象function（我当然也将其克隆），因此我找不到一种渲染方法。

但是，如果子DOM节点只是一个像a这样的节点div，则它按预期运行。

我的解决方法是检查子类型，如果是子类型，function则将克隆的元素包装成自己的子类型div，如果只是dom节点，则照原样渲染。
但是，我不想用多余的东西包裹孩子，div因为我不想添加不必要的DOM节点。

这是一个基本的代码示例，为简洁起见，删除了大多数代码：
Parent组件：

class Parent extends Component {

    attachRef = node => {
        this.ref = node;
    }

    render() {
        const { render } = this.props;
        const { someValue } = this.state;
        const Child = render(someValue);
        const WithRef = React.cloneElement(Child, {
            ref: this.attachRef
        }); …

我有一个使用react挂钩的简单react组件。我正在使用useEffect和useState。
问题是我意识到我的API受到了很大的打击，调试后我发现useEffect没有停止运行！

这是我非常简单的代码：

function DisplayUser({userId}) {
  const [loggedUser, setLoggedUser] = React.useState(null);
  React.useEffect(() => {
    fetchData(userId).then(user => {
      setLoggedUser(user);
    })
  });
  return (
    <div>
      <div>{loggedUser}</div>
    </div>
  );
}