react native ScrollView — программная прокрутка вниз

#react-native #react-native-scrollview

#react-native #react-native-scrollview

Вопрос:

Я пытаюсь прокрутить до конца ScrollView, если пользователь выбирает «Да» из предупреждения …. используя ссылки. Однако он не работает…кто-нибудь может помочь?

Ниже приведен код для тега открытия компонента ScrollView

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

Ниже приведен код в другом месте класса

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

Комментарии:

1. Вы используете функциональный компонент или компонент класса?

Ответ №1:

Это должно сработать в вашей реализации.

Мой оператор возврата в функции рендеринга выглядит следующим образом

       <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>
 

Это мое оповещение, в котором я смог прокрутить страницу вниз, используя ссылку

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

Взгляните на полностью работающий пример закуски.

Не уверен, где что-то ломается в вашем коде. Используйте это в качестве ссылки. Возможно, предоставление большего количества кода поможет нам разобраться в проблеме.