##よく使うInputタグのプラパティについてまとめた。(レイアウトは適当)
const [enteredValue, setEnteredValue] = useState('');
const [selectedNumber, setSelectedNumber] = useState();
const numberInputHandler = inputText => {
setEnteredValue(inputText.replace(/[^0-9]/g, '')); //0〜9以外を''に置換
};
const confirmInputHandler = () => {
const chosenNumber = parseInt(enteredValue);
if (Number.isNaN(chosenNumber) || chosenNumber <= 0 || chosenNumber > 99) {
Alert.alert(
'Invalid number!',
'Number has to be a number between 1 and 99.',
[{text: 'Okay', style: 'destructive', onPress: resetInputHandler }])
return;
}
setSelectedNumber(parseInt(chosenNumber));
setEnteredValue('');
Keyboard.dismiss(); //キーボード非表示にする。
};
return (
<View>
<Input
style={styles.input}
blurOnSubmit //trueならsubmit時にぼやける
autoCapitalize='none' //自動大文字修正をキャンセル
autoCorrect={false} //自動単語修正をキャンセル
keyboardType="number-pad"
maxLength={2}
onChangeText={numberInputHandler}
value={enteredValue}
/>
</View>
<Button title="Confirm" onPress={confirmInputHandler} />
);
以下プロパティの値
###autoCapitalize
characters: all characters.(全文字)
words: first letter of each word.(各語のイニシャルのみ)
sentences: first letter of each sentence (default).(文のイニシャルのみ)
none: don't auto capitalize anything.
###keyboardType#
default
number-pad
decimal-pad
numeric
email-address
phone-pad