728x90
์ ๋ ฅ์ ํด์ผํ๋ ํ๋ฉด์์ TextInput์ focus ๊ฐ ๋๋ฉด
์๋์ผ๋ก Keyboard๊ฐ ์ฌ๋ผ์ค๋๋ฐ, ์๋ฌด๊ณณ์ด๋ ํด๋ฆญํ์๋ ์ด๋ฅผ ๋ค์ ๋ด๋ ค๊ฐ๊ฒ ํ๊ณ ์ถ๋ค.
TouchableWithoutFeedback, Keyboard ๋ฅผ ์ฌ์ฉํ์ฌ ๊ฐ๋จํ๊ฒ ๊ตฌํํ ์ ์๋ค. \
TouchableWithoutFeedback ํ๊ทธ๋ก ์ ์ฒด ์์ญ์ ๊ฐ์ผ๋ onPress ํจ์์ Keyboard.dismiss() ํจ์๋ง ํธ์ถํ๋ฉด ๊ฐ๋จํ๊ฒ ํด์ ๋๋ค.
์์ ์ฝ๋)
return (
<TouchableWithoutFeedback onPress={() => {
console.log('dismissed keyboard')
Keyboard.dismiss()
}}>
<View style={styles.container}>
<Header/>
<TextInput
style={styles.input}
placeholder='Write something...'
onChangeText={chageHandler}
/>
</View>
</TouchableWithoutFeedback>
);
}
์๊ฐ๋ณด๋ค ์ ๋ง ๊ฐ๋จํ๋ค.
์ต๊ด์ ์ผ๋ก javascript๋ก๋ง ํด๊ฒฐํ๋ ค๊ณ ํ๋๋ฐ... ๊ทธ๋ฅ ์ฌ๋งํ๋ฉด ๋ค ๋ถ๋ฌ์ค๋ฉด ๋๋ค. ํํ ๋จธ์ฑ์ฝ์ฑ๐
๋ฐ์ํ
'๊ฐ๋ฐ ๐พ > React Native' ์นดํ ๊ณ ๋ฆฌ์ ๋ค๋ฅธ ๊ธ
screenOptions๋ก ํค๋ ๊พธ๋ฏธ๊ธฐ (0) | 2022.07.30 |
---|---|
React Router (0) | 2022.07.19 |
[expo] ์นํฐํธ webfont ์ ์ฉํ๊ธฐ (0) | 2022.07.18 |
expo๋ก ์์ํ ๋ ๊ธฐ๋ณธ ์ค์ง ๋ชฉ๋ก ์ ๋ฆฌ (0) | 2022.07.09 |