import React, { useState } from "react";
import ReactDOM from "react-dom";

import "./styles.css";

const App = () => {
  const defaultList = [
    { name: "ItemOne" },
    { name: "ItemTwo" },
    { name: "ItemThree" }
  ];

  const [list, updateList] = useState(defaultList);

  const handleRemoveItem = (e) => {
   const name = e.target.getAttribute("name")
    updateList(list.filter(item => item.name !== name));
  };

  return (
    <div>
      {list.map(item => {
        return (
          <>
            <span name={item.name} onClick={handleRemoveItem}>
              x
            </span>
            <span>{item.name}</span>
          </>
        );
      })}
    </div>
  );
};

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

Popularity 10/10 Helpfulness 6/10 Language javascript

Source: stackoverflow.com

Tags: javascript j

Link to this answer
Share Copy Link

Contributed on Sep 18 2020

Busy Buzzard

0 Answers Avg Quality 2/10

react hooks remove item from array

Comment

{

cards:[

"id":"1",
      "name":"something"

   ]

}

Popularity 9/10 Helpfulness 1/10 Language javascript

Source: stackoverflow.com

Tags: javascript j

Link to this answer
Share Copy Link

Contributed on Sep 05 2021

|_Genos_|

0 Answers Avg Quality 2/10

delete a row in an array react hooks

Contents

More Related Answers

delete a row in an array react hooks

Closely Related Answers

react hooks delete item from array

react hooks remove item from array

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.