jeudi 13 mai 2021

how to implement checkbox in flatlist, when user checked one of checkbox and get that product id?

I want a product item with title and checkbox, when user press on of product checkbox and get id of that product.

                     <FlatList 
                        data={wishlistItems}
                        keyExtractor={item => item.productId}
                        renderItem={itemData =>    
                            <View style={styles.mainContainer}>
                                <View style=>
                                    <View style={styles.checkBoxContainer}>
                                        <Checkbox 
                                            color="#192341"
                                            uncheckedColor="#A9A9A9"
                                            status={setChecked(!checked)}
                                            onPress={handleClick}
                                        />
                                    </View>  
                        
                                    <View style=>
                                            <Text style=>{itemData.item.productTitle}</Text>
                                    </View>
                                    
                                    <View style=>
                                        <TouchableOpacity 
                                            onPress={() => {
                                                props.navigation.navigate("Product", {
                                                    productId: itemData.item.productId,
                                                    productTitle: itemData.item.productTitle,
                                                })
                                            }}>         
                                            <SvgXml xml={xml.rightArrow}  marginTop={26} width={18} height={18}/> 
                                        </TouchableOpacity>
                                    </View>
                            </View> 
                                <Image source={require('../assets/images/VectorLine.png')} style=/>
                            </View>
                         }
                    />

how can i do this, I'm using useState and functional component and react-native-paper checkbox. I'm new in react native.




Aucun commentaire:

Enregistrer un commentaire