Question

我正在尝试将回调传递给我的自定义钩子：

export default function useScreenshotDetection(onScreenshot) {
   useEffect(() => {
      ...
      onScreenshot();
      ...
   }, []);
}

但由于某种原因，它没有被检测到，它是未定义的。这是我传递它的方式：

export default function ChatScreen({ ... }) { 
   const { colors } = useTheme();

   const bottomSheet = useMessageBottomSheet();

   useScreenshotDetection(handleOnScreenshot); // <-----

   const [messages, setMessages] = useState([]);

   ...

   const handleOnScreenshot = () => { // <-----
      ...
   }

   return <></>
}

我认为这是因为在调用钩子时尚未在第一次渲染中创建该方法，我应该将它移到该方法下。但是……还有别的办法吗？我的意思是，我喜欢，而且我认为它使代码非常易读，将所有钩子都放在我的组件顶部。

有什么想法吗？

Answer 1

如果您确实需要，可以将 const handleOnScreenshot = () => {} 更改为 function handleOnScreenshot() {}。不同之处在于后者在作用域的顶部被提升和初始化。

React Native - 将回调传递给自定义钩子是未定义的

1 个答案: