使用React Native打开键盘时更新滚动视图

Question

我想知道在使用React Native打开键盘时如何更新滚动视图吗？

我尝试在“ ScrollView”中使用“ onContentSizeChange”，但是没关系，但是当我打开键盘时，滚动视图不会更新（底部）

当我单击输入以向磁带发送文本时（1），打开键盘时（2）滚动视图不会更新。我想更新我的滚动视图（3）。

  

MessageList.js

export default class MessageList extends React.Component {
    render() {
        return (
            <View style={MessageListStyles.container}>
                <ScrollView
                    ref={ref => this.scrollView = ref}
                    onContentSizeChange={(contentWidth, contentHeight)=>{
                        this.scrollView.scrollToEnd({animated: true});
                    }}
                    contentContainerStyle={{
                        flexGrow: 1,
                        justifyContent: 'space-between'
                    }}>
                      <Message sender="bot" />
                      <Message sender="bot" />
                      <Message sender="bot" />
                      <Message sender="bot" />
                      <Message sender="bot" />
                      <Message sender="bot" />
                      <Message sender="bot" />
                </ScrollView>
            </View>
        );
    }
}

Answer 1

您是否打算在出现键盘时将滚动视图移开？在这种情况下，您将使用KeyboardAvoidingView。它会根据您的需要添加底部或顶部填充。

或者，您可以添加一个在打开键盘后触发的侦听器，然后将您的scrollToEnd代码放在此处：keyboardDidShowListener