This code uses RadioButton
provided from React Native Paper
<RadioButton.Group
onValueChange={value => setValue(value)}
value={value}
>
<RadioButton.Item
style={{justifyContent: "space-around"}}
label="English (US)"
value="lang_en"
status={"checked"}
color="#1E6DAD"
/>
<Divider />
<RadioButton.Item
style={{justifyContent: "space-around"}}
label="Indonesia"
value="lang_id"
color="#1E6DAD"
/>
</RadioButton.Group>
Running the code on Android emulator, the result is:
My expectation is English (US)
radio button to be checked. What's missing here?
This is from the documentation itself. I think your useState initialization is missing the correct value. In the following code first
is placed as initial state, in your case, this should be lang_en
.
const [value, setValue] = React.useState('first');
return (
<RadioButton.Group onValueChange={newValue => setValue(newValue)} value={value}>
<View>
<Text>First</Text>
<RadioButton value="first" />
</View>
<View>
<Text>Second</Text>
<RadioButton value="second" />
</View>
</RadioButton.Group>
);