TextInput предотвращает прокрутку ScrollView от

Question

У меня есть форма, длина которой больше, чем высота экрана телефона. Это ScrollView, содержащий компоненты TextInput. Проблема в том, что когда я хочу перетащить начало касания на TextInput, ScrollView не перемещается. Если я перетаскиваю начало в пустое пространство (View в примере кода), он прокручивается отлично.

Похоже, что TextInput как-то ест событие касания/перетаскивания, не позволяя взаимодействовать с ScrollView.

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

function Form() { 
    return (
     <ScrollView style={{ flex: 1, }}> 
      <TextInput placeholder="test" /> 
      <TextInput placeholder="test" /> 
      <TextInput placeholder="test" /> 
      <TextInput placeholder="test" /> 
      <TextInput placeholder="test" /> 
      <View style={{ height: 150, }} /> 
      <TextInput placeholder="test" /> 
      <TextInput placeholder="test" /> 
      <TextInput placeholder="test" /> 
      <TextInput placeholder="test" /> 
     </ScrollView> 
    ); 
} 

Как я могу сделать скроллинг работу?

Обновление: Я заметил, что когда я начинаю прокручивать пробел, я могу продолжать прокрутку, касаясь входов. Однако, как только инерция останавливается, я не могу снова прокручивать с помощью входов.

Answer 1

Итак, похоже, что это ошибка в версии 0.32 версии React Native. Прокрутка работает, как и ожидалось, в 0,33. Он был решен this commit.

Answer 2

Update: это может помочь - scrollview can't scroll when focus textinput react native

это может быть недостающим <View style={{ flex: 1 }}> обертывание вокруг <ScrollView>?

Я попробовал это, и она прокручивается отлично как от внутреннего View и TextInput компонентов:

render() { 
    return (
     <View style={{ flex: 1 }}> 
      <ScrollView style={{ flex: 1 }} > 
       <TextInput placeholder="this is a textinput with height 200" style={{ borderColor: 'brown', borderWidth: 1, height: 200 }} /> 
       <TextInput placeholder="this is a textinput with height 1200" style={{ borderColor: 'brown', borderWidth: 1, height: 1200 }} /> 
       <View style={{ height: 150, backgroundColor: 'khaki' }} /> 
       <TextInput placeholder="this is a textinput with height 200" style={{ borderColor: 'brown', borderWidth: 1, height: 200 }} /> 
      </ScrollView> 
     </View> 
    ); 
} 

Но так как вы говорите, что она прокручивается при перемещении с точки зрения компонента, может быть, разделяя весь код может показать что-то