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

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() {}。不同之处在于，后者在作用域的顶部被提升和初始化。