score:0

Change your delItem function to be higher order... You can have delItem() be a function that returns a function, and that function can use a parameter passed to the delItem() function... Pass the fruit!

delItem = (fruit) => () => {
  console.log('Click happened');
  console.log(item)

  // delete your fruit
}

Then bind onClick as follows:

<p className="del-btn" onClick={this.delItem(item)}> x </p>

score:1

Well, You can choose to send item ref directly in function onClick - this.delItem.bind(this, item)

delItem(item) {
   let fruits= this.state.fruits;

   function findFruit(element, index, array){
        return element==item;
   }

   let index = fruits.findIndex(findFruit);
   fruits.splice(index,1);
   this.setState({fruits : fruits});
}

Related Query

More Query from same tag