How do we Boolean TextInput in react native. I tried to use radio button or checked button but i was unable to send selected data to server side when user clicked submit button on the form. If I use checked button the how do i know that button is checked by user ? I'm new to react native, it would be great help. I'm reading docs of react native but using boolen text input it was difficult for me to understand. Thank you.
I'm using Picker it would be great to know if there are better option
<Picker
selectedValue={status}
style={{ height: 50, width: 150 }}
onValueChange={(itemValue) => setStatus(itemValue)}
>
<Picker.Item label="True" value="True" />
<Picker.Item label="False" value="False" />
</Picker>
The label
for the Picker.Item
is the text that is show to the user, so that always needs to be a string
. But for the value
prop, we can pass the boolean
values true
and false
rather than a string
. That's it!
<Picker
selectedValue={status}
style={{ height: 50, width: 150 }}
onValueChange={setStatus}>
<Picker.Item label="True" value={true} />
<Picker.Item label="False" value={false} />
</Picker>
A dropdown menu isn't the most intuitive way to select a true
/ false
value. I would say that a Switch
is the best (though for some reason this isn't rendering right on expo Web).
<Switch
value={status}
onValueChange={setStatus}
/>
Different components have different props, so check the docs to see if the value is a boolean
, string
, etc. For a single RadioButton
, you use status={ status ? 'checked' : 'unchecked' }
status={ status ? 'checked' : 'unchecked' }
because it is controlled by the strings 'checked'
and 'unchecked'
.
Here's a demo showing four different options.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.