How to access custom attributes from event object in React

Question

With the help of code and example can u tell me How to access custom attributes from event objects in React?

Answer 1

The best way to access custom attributes from an event object is by using HTML data-* attributes and retrieving them with event.target.getAttribute().

Example:

function App() {

  const handleClick = (event) => {

    const customValue = event.target.getAttribute("data-id");

    console.log("Custom Attribute:", customValue);

  };

  return <button data-id="12345" onClick={handleClick}>Click Me</button>;

}

export default App;