react nativeでhtmlのフォーム様な入力をするサンプル。
関数コンポーネント版。
import React, {useState} from 'react';
import {
Text,
View,
TextInput,
} from 'react-native';
const TestComponent = () => {
const [name, setName] = useState('');
const [kosu, setKosu] = useState('');
// それぞれのstateを変える関数
const changeState = {
name: e => {
setName(e);
},
kosu: e => {
setKosu(e);
}
};
return (
<View>
<Text>商品名</Text>
<TextInput
value={name}
placeholder="商品名"
autoCapitalize="none"
onChangeText={changeState.name}
/>
<Text>個数</Text>
<TextInput
value={kosu}
placeholder="個数"
autoCapitalize="none"
onChangeText={changeState.kosu}
/>
</View>
);
}
export default TestComponent;
コンポーネントに内容を変える関数を書くべきではない?
だって分かりやすいんですもの…