React-Native:如何知道渲染何时完成

Question

我在 render() 函数中有一个带有引用的 FlatList，

 <FlatList
    ref={(ref) => { this.flatListRef = ref }}
    data={this.state.data}
    renderItem={({ item, index }) => this.renderOuterCard(item, index)}
/>

我需要使用this.flatListRef 来调用FlatList 的 方法，这只有在呈现FlatList 时才有可能。否则会出现以下错误，

Cannot read the property 'ScrollToIndex' of undefined

(我试图调用FlatList的ScrollTOIndex方法)

其实我在componentDidMount()方法中调用了ScrollTOIndex，但是还是出现这个错误。因此，很明显 componentDidMount() 在 render() 完全完成之前被调用。

谁能告诉我渲染完成的确切时间？

Answer 1

This is clear that componentDidMount() is called before render() finishes completely.

根据此架构，第一个 render 阶段发生在之前 componentDidMount。 http://projects.wojtekmaj.pl/react-lifecycle-methods-diagram/

实例:

https://snack.expo.io/@flexbox/flatlist-with-state-example