javascript - 使用 React Native 打开键盘时更新 ScrollView

Question

我想知道如何在使用 React Native 打开键盘时更新 ScrollView ？

我尝试在“ScrollView”中使用“onContentSizeChange”，没问题，但是当我打开键盘时， ScrollView 没有更新(底部)

当我单击我的输入以发送磁带文本 (1) 时，当键盘打开时 ScrollView 不会更新 (2)。我想更新我的 ScrollView (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

您的目标是在键盘出现时将 ScrollView 移开吗？在这种情况下，您使用 KeyboardAvoidingView .它根据您的需要添加底部或顶部填充。

或者，您可以添加一个在键盘打开后触发的监听器，并将您的 scrollToEnd 代码放在那里:keyboardDidShowListener