在我的应用程序中,我有一个文本输入,每当用户单击屏幕上的任意位置或关闭键盘时,我想隐藏键盘并失去焦点。
我为此创建了这个函数:
interface DismissKeyBoardProps {
children?: ReactNode
}
const DismissKeyboard: React.FC<DismissKeyBoardProps> = ({ children }) => (
<TouchableWithoutFeedback
onPress={() => Keyboard.dismiss()}> {children}
</TouchableWithoutFeedback>
);
我像这样使用上述方法:
const App: React.FC = () => {
return (
<>
<StatusBar barStyle="dark-content" />
<SafeAreaView>
<Text> Test </Text>
<DismissKeyboard>
<TextInput placeHolder= {"place holder"}/>
</DismissKeyboard>
</SafeAreaView>
</>
);
};
但是,当我尝试运行它时,出现错误:
React.children.only expected to receive a single React element child.
我不明白为什么我会收到这个错误,什么时候DismissKeyBooard
确实只有一个孩子 - TextInput
。
编辑: 我尝试了这样的建议解决方案,但我不断收到同样的错误。
return (
<View>
<SafeAreaView>
<>
<DismissKeyboard>
<TextInput style={{height: 40, borderColor: 'gray', borderWidth: 1}} placeHolder={"hint"}/>
</DismissKeyboard>
</>
</SafeAreaView>
</View>
);