键盘出现在KeyboardAvoidingView中后如何在ScrollView上保持滚动位置

时间:2019-04-07 18:04:32

标签: reactjs native

我在KeyboardAvoidingView内部有一个ScrollView和一个View。出现键盘时一切都会平移,但是ScrollView的滚动位置不会更新,当键盘出现时,我至少需要滚动到底部

我尝试引用ScrollView并调用scrolltoEnd,但是它返回错误消息,说它不是函数。

export default class App extends React.Component {
  render() {
    return (
      <KeyboardAvoidingView style={{flex:1}} behavior="padding" enabled>
            <ChatView/>
            <Chatbox/>
      </KeyboardAvoidingView>
    )
  }
}

class ChatView extends Component {
  constructor(props) {
    super(props);

    this.state = {
      messages: [{text:'test', type:'incoming'}]
    }

  }


  render() {
    let Arr = this.state.messages.map((a, i) => {
      if(a.type == 'incoming') {
        return <ChatBubbleIncoming text={a.text} time="test" color="#FF0000" time="12:00" username="Jaime"></ChatBubbleIncoming>
      }
    })
    return(
      <View style={{flex:1}}>
      <ScrollView
        style={{ flex: 1 }}
        ref={ref => this.scrollView = ref}
        onContentSizeChange={(contentWidth, contentHeight)=>{
            this.scrollView.scrollToEnd({animated: true});
        }}>
        {Arr}
      </ScrollView>
      </View>
    )
  }
}

我想更新ScrollView滚动位置。即使我只在键盘显示时让它滚动到底部

0 个答案:

没有答案