Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6288

react native: uncheck of checkbox doesn't works

$
0
0

I really want to know how I can change my sample code so that it is possible to uncheck the checkbox?At the moment I can only check but cant uncheck and I really do not understand where the problem is.I would be happy for some help with show me how to change my code for the desired result .

import CheckBox from '@react-native-community/checkbox';import { useRoute, useNavigation } from '@react-navigation/native';export const ActionsScreen = () => {  const route = useRoute<ActionScreenRouteProp>();  const params = route.params;  const { actionList, eventType, emergencyRole } = params  const [checkList, setCheckList] = useState<any[]>(actionList.map(e => ({ key: e.key, checked: false })));  const isChecked = (key) => {    checkList.filter(e => e.key == key)[0].checked  }  const renderActionItem = ({ item, index }) => {    return (<TouchableOpacity        key={index}        activeOpacity={.7}        style={styles.touchableOpacity}        onPress={() => { console.log(item) }}><CheckBox          style={styles.checkBox}          tintColors={{ true: 'white', false: 'white' }}          value={isChecked(item.key)}          onValueChange={() => {            const newCheckList = checkList.slice()            newCheckList.forEach(e => {              if (e.key == item.key) {                e.checked = !e.checked              }            })            setCheckList(newCheckList)          }}        /><Text style={styles.labelText}>{`${item.sequenceID}. ${item.label}`}</Text></TouchableOpacity>    )  }  return (<SafeAreaView style={styles.container}><FlatList          style={styles.flatListView}          data={actionList}          keyExtractor={(item, index) => index.toString()}          renderItem={renderActionItem}        /></SafeAreaView>  );}

Viewing all articles
Browse latest Browse all 6288

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>