React Native - 如何衡量ScrollView中的内容大小?

时间:2016-04-19 14:10:13

标签: javascript reactjs scrollview react-native nativemethodsmixin

我想测量ScrollView中的内容大小。

因此,我使用measure中的NativeMethodsMixin

import NativeMethodsMixin from 'NativeMethodsMixin'

我不太确定从哪里开始,与此问题相关的大多数SO帖子似乎已经过时了。

我了解到我需要为ref创建一个ScrollView(我做过并称之为_scrollView,我可以使用this.refs._scrollView访问它。)

问题是,我无法像this.refs._scrollView一样将measure传递给NativeMethodsMixin.measure(this.refs._scrollView, (data) => { console.log('measure: ', data) })

ExceptionsManager.js:61 findNodeHandle(...): Argument is not a component (type: object, keys: measure,measureInWindow,measureLayout,setNativeProps,focus,blur,componentWillMount,componentWillReceiveProps)

我收到以下错误:

findNodeHandle

然后,我尝试使用measure检索实际节点句柄,并将其传递到const handle = React.findNodeHandle(this.refs._scrollView) NativeMethodsMixin.measure(handle, (data) => { console.log('measure: ', data) }) ,如github issue中所述:

Mix_OpenAudio(44100, MIX_DEFAULT_FORMAT, 1, 1024)

但这会导致同样的错误。有什么想法吗?

2 个答案:

答案 0 :(得分:10)

ScrollView定义了一个名为onContentSizeChange的道具:

<ScrollView
  onContentSizeChange={(width, height) => {
    console.log(width, height);
  }}>
  {content}
</ScrollView>

答案 1 :(得分:6)

NativeMethodsMixin.measure.call(elementToMeasure, (x, y, width, height) => {
  ...
});
相关问题