Touchable Opacity 需要在键盘打开时点击两次才能提交 - 将 keyboardShouldPersistTaps 传递给 ScrollView 不起作用 - 新鲜的想法

Touchable Opacity Requires Two Taps to Submit When Keyboard Open - Passing keyboardShouldPersistTaps to ScrollView Does Not Work - Fresh Out Of Ideas

如果这似乎是一个重复的问题,请提前道歉。

问题已得到充分记录:我有一个视图组件。在该视图中,我有一个用作提交按钮的 TouchableOpacity。在 ScrollView 中我有一个 TextInput。当用户聚焦 TextInput 时,键盘打开。出于 UX 目的,我相信用户应该能够按下 TouchableOpacity 并且 TouchableOpacity 应该在第一次尝试时注册按下。这不是行为。第一次按下关闭键盘,然后用户必须再次按下 TouchableOpacity 才能提交 TextInput:

    <View>
      <Formik
        initialValues={{ messageBody: '' }}
        onSubmit={(values) => handleSubmitting(values)}>
        {({ handleChange, handleSubmit, values }) => (
          <View>
            <TouchableOpacity
              style={styles.appButtonContainer}
              onPress={handleSubmit}>
              <CustomIcon name="send" size={15} 
              style={styles.icon} />
            </TouchableOpacity>
            <ScrollView keyboardShouldPersistTaps='always'>
              <TextInput
                placeholder="Reply to post"
                style={styles.newMessageBox}
                value={values.messageBody}
                onChangeText={handleChange('messageBody')}
              />
            </ScrollView>
          </View>
        )}
      </Formik>
    </View>

我已经尝试过本文中提供的解决方案:https://medium.com/react-native-training/todays-react-native-tip-keyboard-issues-in-scrollview-8cfbeb92995b

同样的解决方案在 github 和堆栈溢出之间已经发布了十几次:将 keyboardShouldPersistTaps='always' 属性传递给 ScrollView。但它不起作用。我试过将道具传递给每个元素。我尝试将道具从 'always' 更改为 'handled',再更改为 true。我试过将 TouchableOpacity 和 TextInput 包装在 ScrollView 中。我试过将所有内容包装在 ScrollView 中。我试过取出 Formik。我试过将样式简化为骨架。我试过交换 TextInput 和 TouchableOpacity 的位置。没有任何效果。

非常感谢任何帮助。

2021 年 6 月 11 日更新

在我终于弄明白之前,我已经在这里和那里戳了一个月的大部分时间。我读到的大部分内容都暗示 keyboardShouldPersistTaps 道具应该放在 TextInput 的下一级组件上 - 在我的例子中是 ScrollView 组件。就我而言,这不是真的。

在我的例子中,keyboardShouldPersistTaps 道具必须不在下一个更高级别的组件上,而是在用户与之交互的最高级别组件上。对我来说,这是一个 SectionList,在每个 TextInput 中呈现。

当它起作用时,我差点心脏病发作。

正如上面编辑中提到的,在我终于弄明白之前,我已经在这里和那里戳了一个月的大部分时间。我读到的大部分内容都暗示 keyboardShouldPersistTaps 道具应该放在 TextInput 的下一级组件上 - 在我的例子中是 ScrollView 组件。就我而言,这不是真的。

在我的例子中,keyboardShouldPersistTaps 道具必须不在下一个更高级别的组件上,而是在用户与之交互的最高级别组件上。对我来说,这是一个 SectionList,在每个 TextInput 中呈现。