npm install react-native-input-sheet --save
import InputSheet, {InputSheetRef} from 'react-native-input-sheet';
const Example = () => {
const inputSheetRef = useRef<InputSheetRef>(null);
const showInputSheet = useCallback(() => {
inputSheetRef.current?.show();
}, []);
return (
<>
<Button onPress={showInputSheet}>Press me</Button>
<InputSheet ref={inputSheetRef} onSubmit={console.log} />
</>
)
}
Prop | Default | Required | Description |
---|---|---|---|
defaultValue | false | no | the default value of textInput |
required | true | no | Whether the text input value is required |
placeholder | '' | no | The placeholder of the textInput |
onSubmit | (text) => {} | no | Function that is called when user submits it |
buttonText | 'submit' | no | The string that is displayed on the submit button |
maskStyle | - | no | The style of the masker( ) |
style | - | no | The style of the container( ) |
inputStyle | - | no | The style of the textInput( ) |
buttonTextStyle | - | no | The style of the submit button text( ) |
autoClearText | true | no | Whether textInput needs be clear after onSubmit finished |
inputProps | undefined | n o | The props of textInput |
keyboardVerticalOffset | 10 2 | no | The keyboardVerticalOffset of KeyboardAvoidingView |