如何使用React钩子回调嵌套函数中的函数

时间:2020-04-11 14:06:01

标签: javascript reactjs callback react-hooks

我需要回调。一种。在嵌套函数中设置状态后触发点击的函数,我该如何处理,我知道在嵌套函数中调用钩子不起作用,但在我的情况下是必须的。我尝试使用useEffect和useCallback,但按预期效果无法正常工作代码简而言之是这样的:

const App = () => {
  const [elements, setElements] = useState(true);

  function UseEffectSkipFirst(fn, arr) {
    const isFirst = useRef(true);

    useCallback(() => {
      if (isFirst.current) {
        isFirst.current = false;
        return;
      }

      fn();
    }, arr);
  }

  const Shape = (g) => {
    // let colorMatrix = new PIXI.filters.ColorMatrixFilter();
    // let color = 0xffffff
    // let tint = 0xffffff;

    function onClick(event) {
      setElements(false);
      UseEffectSkipFirst(
        () => {
          if (elements === true) {
            this.data = event.data;

            this.dragging = true;
            this.offX = this.x - this.data.getLocalPosition(this.parent).x;
            this.offY = this.y - this.data.getLocalPosition(this.parent).y;
          } else {
            g.clear();
          }
        },
        [elements]
      );
    }
    // ...
  };
  return (
    //...
  );
};

任何人都可以帮忙,谢谢

0 个答案:

没有答案