Scroll to end of FlatList after displaying the keyboard

I'm making a chat component and I want about the same things. Did it like this:

<FlatList
   ref={ref => this.flatList = ref}
   onContentSizeChange={() => this.flatList.scrollToEnd({animated: true})}
   onLayout={() => this.flatList.scrollToEnd({animated: true})}
   ...
/>

Keyboard popping up triggers a layout, so that's fixed. New chat messages arriving trigger content changes, so it also scrolls to the bottom (which is what I wanted for my chat window)

actually if you always want to scroll to the end, mean you always want see latest message, am I right?

then use new version of react-native. and add inverted to change upside down of the flat list.

<FlatList
      inverted
      style={{ flex:1}}
      ref="flatList1"
      data={this.state.messages}
      renderItem={({ item }) => <Text>{item.text}</Text>}
    />

then rearrange your this.state.messages upside-down. then your latest message will always shown at the bottom of flatlist

For my case, I doesn't need to use KeyboardAvoidingView