如何在触摸父视图时显示键盘

Question

我正在使用 React Native 和 Expo 创建一个应用程序。其中一个搜索输入包含一个图标，所以我这样做了：

        <View style={styles.inputContainer}>
            <FontAwesome name="search" size={20} color="black" />
            <TextInput
                style={styles.input}
                value={search}
                placeholder="Pesquise"
                placeholderTextColor={text_gray}
                onChangeText={(text) => setSearch(text)}
            />
        </View>

但是只有当我点击 TextInput 时才会显示键盘，我需要在我点击包裹它的视图和图标的任何地方打开它。我怎样才能做到这一点？

Answer 1

创建对 TextInput 的引用，然后调用 REF.current.focus() 以关注 textInput 并调用 REF.current.blur() 对其进行模糊处理。使用 Pressable 而不是 View，它就像一个 View 但具有不同的 onPress 事件。

const textInput = useRef(null);

return (
  <Pressable style={styles.inputContainer} onPress={() => textInput?.current?.focus()}>
    <FontAwesome name="search" size={20} color="black" />
    <TextInput
      ref={textInput}
      style={styles.input}
      value={search}
      placeholder="Pesquise"
      placeholderTextColor={text_gray}
      onChangeText={(text) => setSearch(text)}
    />
  </Pressable>
)

如何在触摸父视图时显示键盘

How to make the Keyboard show when touching the parent view

textinput

react-native