CODEWITHSUNDEEP
javascriptarraysreact-native
VK1
VK1

Reputation: 1716

How do I use filter to return a new array minus the one item that has been selected?

I'm using Flatlist to render a list of items. In Componentwillmount, I set the state to result of a fetch.

constructor() {
        super();
        this.state = {
            listOfCameras: [],
        };
    }

componentWillMount() {
        apiService.listCameras().then((res) => {
            this.setState({ listOfCameras: res });
        });
    }

My Flatlist looks like this:

createListOfCams() {
    return (
        <FlatList
            data={this.state.listOfCameras}
            renderItem={({ item, index }) => {
                return (
                    this.createSingleCamera(item, index)
                );
            }}
            keyExtractor={(item, index) => index.toString()}
            // extraData={}
        />
    );
}

and finally my createSingleCamera looks like this:

createSingleCamera(item, index) {
   const modelCam = item.model;
    return (    
        <View style={styles.singleCamLineView}>
            <View style={styles.modelCamNameView}>
                <Text style={styles.singleCameraText}>{modelCam}</Text>
            </View>
            <View style={styles.deleteIconView}>
                <TouchableOpacity
                    onPress={() => {
                        this.deleteCamFromList(item, index);
                    }}
                >
                    <Text style={styles.singleCameraText}> </Text>
                </TouchableOpacity>
            </View>
        </View>
    );
}

What I'd like to do is pass on the index of the item I want to delete to the deleteCamFromList method and then use that to re-render the Flatlist.

So far my deletefromCamList looks like this:

deleteCamFromList(item, index) {
    let allCamerasBeforeDelete = [...this.state.listOfCameras];
    let newArryOfCams = allCamerasBeforeDelete.filter(index);
}

How would I use filter to return a new array minus the index that I provided it?

Upvotes: 2

Views: 85

Answers (1)

sdgluck
sdgluck

Reputation: 27247

The second argument given to Array.prototype.filter is the item index, so:

deleteCamFromList(item, index) {
    let newArrayOfCams = this.state.listOfCameras.filter((_, i) => i !== index);
    this.setState({listOfCameras: newArrayOfCams})
}

Upvotes: 3

Related Questions