在 React Native 中仅使用其节点句柄检测 ScrollView 高度的变化

Question

我有一个 ScrollView，它可以根据用户输入改变高度。 我希望能够检测到这些更改何时发生，但我无权访问组件本身，所以我不能只传入回调“onContentSizeChanged”，我所拥有的只是 findNodeHandle(scrollViewRef) 返回的 ref 和节点句柄

由于实现细节，它必须是这样的。 但是，我一直在努力寻找关于这种处理布局更改的方法的任何材料/帖子。 我什至不需要知道新的布局，只需要知道发生的变化就可以触发对 ScrollView 内元素的重新测量。

有什么方法可以只使用 ref/node 句柄来完成我想完成的事情，而不必将任何道具传递给 ScrollView？ 谢谢！

到目前为止，我不知道从哪里开始解决这个问题（除了用patch-package修改 react-native 之外）。 我查看了文档和 ScrollView 组件代码，但找不到任何可能有帮助的信息。

ResizeObserver 当然会很整洁，但我的代码需要在 iOS、Android 和 web 上运行。

Answer 1

可能有可能使用 React Native 提供的onLayout道具来完成您想要做的事情。

你可以这样做：

import { findNodeHandle } from 'react-native'

const scrollViewRef = useRef(null)
const scrollViewNode = findNodeHandle(scrollViewRef.current)

const handleLayoutChange = (event) => {
    // Do whatever you want on layout change here
}

<ScrollView ref={scrollViewRef} onLayout={handleLayoutChange}>
    {/* ... */}
</ScrollView>