在reactjs中的每个组件中重用useEffect代码

Question

我有一个useEffect，它在类似这样的组件中初始化wowjs：

import WOW from "wowjs";

const HomePage = () => {

useEffect(() => {
        const wow = new WOW.WOW({
        boxClass: "wow",
        animateClass: "animated",
        offset: 0,
        mobile: false,
        live: true,
        scrollContainer: null
      });
      wow.init();
    }, []);

  return (
    <div>
      ....
    </div>
  )
}

我希望在许多组件中使用此useEffect，以便wowjs动画可以在每次路线更改时运行。如何避免在我的reactjs项目中重复此代码？

Answer 1

正如RTW在他的评论中提到的，您可以使用HOC来集中此代码。

但是似乎您已经被钩子迷住了，我建议将此代码放在自定义的useWow钩子中，并在您可能需要的每个组件中调用此钩子。