Galera, como posso fazer esse checkbox dinâmico? Porque desta forma que está ai tenho que criar um useState para cada checkbox, mas quando eu for puxar esses valores do banco irão vir diâmicamente, como criar os useState também dinamicamente? Snack do código funcionando: https://snack.expo.io/@wendellchristian/checkbox
import React, { useEffect, useState } from 'react';
import { Text, View, StyleSheet } from 'react-native';
import Constants from 'expo-constants';
import { RadioGroup, CheckBox } from 'react-native-btr';
export default function App() {
const [checked, setChecked] = useState(false);
const [checked2, setChecked2] = useState(false);
const [checked3, setChecked3] = useState(false);
return (
<View style={styles.container}>
<View style={styles.viewCheckbox}>
<View style={styles.checkbox}>
<CheckBox
checked={checked}
onPress={item => setChecked(!checked)}
color='#009688'
/>
</View>
<Text onPress={item => setChecked(!checked)}> Checkbox 1</Text>
</View>
<View style={styles.viewCheckbox}>
<View style={styles.checkbox}>
<CheckBox
checked={checked2}
onPress={item => setChecked2(!checked2)}
color='#009688'
/>
</View>
<Text onPress={item => setChecked2(!checked2)}> Checkbox 2</Text>
</View>
<View style={styles.viewCheckbox}>
<View style={styles.checkbox}>
<CheckBox
checked={checked3}
onPress={item => setChecked3(!checked3)}
color='#009688'
/>
</View>
<Text onPress={item => setChecked3(!checked3)}> Checkbox 3</Text>
</View>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
paddingTop: Constants.statusBarHeight,
backgroundColor: '#ecf0f1',
padding: 8,
},
paragraph: {
margin: 24,
fontSize: 18,
fontWeight: 'bold',
textAlign: 'center',
},
viewCheckbox: {
flexDirection: "row",
marginBottom: 10,
},
checkbox: {
width: 24,
}
});