Im unable to write more than one letter in the text input.
I have tried to run after clearing the cache expo r -c
Does anyone has any idea why is this happening and how to fix it.
Running with
"expo": "^44.0.5", "react": "17.0.1", "react-dom": "17.0.1", "react-native": "0.64.3",
const Posts = () => {
const isDarkMode = useColorScheme() === 'dark'
const [search, setSearch] = useState('')
const [refresh, setRefresh] = useState(false);
const handleOnEndReach = () => {
}
const handleRefresh = () => {
setRefresh(true)
setTimeout(() => {
setRefresh(false)
}, 3000)
}
return (
<TouchableWithoutFeedback
onPress={() => Keyboard.dismiss()}
style={{flex: 1, backgroundColor: isDarkMode ? colors.dark.background : colors.light.background}}
>
<FlatList
ListHeaderComponent={() =>
<TextInput
value={search}
onChangeText={setSearch}
style={{padding: '2.5%'}}
keyboardAppearance={isDarkMode ? 'dark' : 'light'}
placeholder='Search...'
/>
}
style={{padding: '2.5%'}}
onEndReached={handleOnEndReach}
onEndReachedThreshold={0.5}
refreshControl={
<RefreshControl refreshing={refresh} onRefresh={handleRefresh} tintColor={isDarkMode ? 'white' : 'black'}/>
}
/>
</TouchableWithoutFeedback>
)
}
use defaultValue instead of value, I would write something like this:
function App() {
const [input, setInput] = React.useState("")
function handleChange(e) {
e.preventDefault();
setInput(e.target.value)
}
return (
<input className="text-input" defaultValue={input} onChange={handleChange(e)}/>
)
}