Notice
Recent Posts
Recent Comments
Link
일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | ||||
4 | 5 | 6 | 7 | 8 | 9 | 10 |
11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | 21 | 22 | 23 | 24 |
25 | 26 | 27 | 28 | 29 | 30 | 31 |
Tags
- 백준 10172
- useState
- setstate
- 버스분석
- vetor
- 그대로 출력하기
- R데이터형태
- 값추가
- 데이터분석
- React
- 광명시버스분석
- asynchronization
- getline
- 값삭제
- 10172
- R 그래프
- plot in r
- DataFrame
- 이스케이프시퀀스
- 이용현황분석
- 배열삭제
- 백준
- 백준 11718
- barplot
- react #회원가입 #비밀번호비교
- 배열추가
- 탈출문자
- 그래픽
- await
- barplot in r
Archives
- Today
- Total
devlog_zz
React Native useState , TextInput 본문
728x90
useState
export default function App() {
const [name, setName] =useState('aaaa')
const [person, setPerson] = useState({name:'mario', age:40})
const clickHandler = () => {
setName('bbbb')
setPerson({name:'alice',age:30})
}
return (
<View style={styles.container}>
<Text>My name is {name}</Text>
<Text>His name is {person.name}, his age is {person.age}</Text>
<View style={styles.btnContainer}>
<Button title='update state'onPress={clickHandler} />
</View>
</View>
);
}
button 클릭하면 setName이 실행됨 ( useState )
name이 바뀌면서 화면이 리렌더링 됨
<Button onPress={()=>..}
onPress 사용
<TextInput>
여러줄 입력 받을 때 : multiline
<TextInput
style={styles.input}
multiline
placeholder='e.g John Doe'
onChangeText ={(val)=>setName(val)}/>
숫자 입력만 받을 때
<TextInput
style={styles.input}
keyboardType='numeric'
placeholder='e.g John Doe'
onChangeText ={(val)=>setName(val)}/>
728x90
'Front End > React Native' 카테고리의 다른 글
React Native TouchableOpacity (0) | 2021.01.18 |
---|---|
React Native FlatList (0) | 2021.01.18 |
React Native ScrollView (0) | 2021.01.18 |
Button (0) | 2021.01.18 |
React Native <View>, <Text>, style, styled-components (0) | 2021.01.18 |
Comments