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

Question

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

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

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

消息列表.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