反应原生 scrollView - 以编程方式滚动到底部

时间:2021-03-30 02:54:44

标签: react-native react-native-scrollview

如果用户从警报中选择“是”,我正在尝试滚动到 scrollView 的末尾....使用 refs。但是它不起作用......有人可以帮忙吗?

下面是scrollView组件开始标签的代码

<ScrollView
  ref={ref => {this.scrollView = ref;}}> 

下面是类中其他地方的代码

      Alert.alert(
        'Scroll to end?',
        [
          {
            text: 'No',
            style: 'cancel',
          },
          {
            text: 'Yes',
            onPress: () => {
              this.scrollView.scrollToEnd();
            },
          },
        ],
      ); 

1 个答案:

答案 0 :(得分:0)

它应该适用于您的实现。

我在 render 函数中的 return 语句是这样的

      <SafeAreaView style={styles.container}>
        <Button title={'2-Button Alert'} onPress={this.createTwoButtonAlert} />
        <ScrollView
          style={styles.scrollView}
          ref={ref => {this.scrollView = ref;}}>  // here is ref to my scroll view
          <Text style={styles.text}>
            Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
            eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim
            ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
            
          </Text>
        </ScrollView>
      </SafeAreaView>

这是我的警报,我可以使用 ref 滚动到底部

    Alert.alert('Alert Title', 'My Alert Msg', [
      {
        text: 'Cancel',
        onPress: () => console.log('Cancel Pressed'),
        style: 'cancel',
      },
      { text: 'OK', onPress: () => this.scrollView.scrollToEnd() },
    ]);

看一个完整的示例 snack

不确定您的代码中哪里出现问题。以此作为参考。 也许,提供更多的代码可以帮助我们找出问题所在。