I'm facing an issue where I can't seem to update the state using useState while coding in React Native. The component in question is a styled TextInput named SearchField. Can anyone help me figure out what I might be doing wrong that's preventing the state from recognizing the text input from SearchField?
export const TabOneScreen: FC<IProps> = ({ navigation }) => {
const [userName, setUserName] = useState("jan");
useEffect(() => {
fetch(`https://api.github.com/users/${userName}`)
.then((response) => response.json())
.then((json) => console.log(json));
}, [userName]);
const handleUserName = (value: string) => {
setUserName(value);
};
return (
<StyledContainer>
<SearchField onChangeText={(value: string) => handleUserName(value)} />
<Text>{userName}</Text>
<DetailsField backgroundColor={colors.whiteColor} />
<Button
color={colors.buttonBackground}
title="Show more"
onPress={() => {
navigation.navigate("DetailsScreen");
}}
/>
</StyledContainer>
);
};