!snippet usecallback

!snippet useCallback() for deletable todo app

import {memo, useCallback, useState} from "react";
const Items = memo(function Items({items, onDelete}) {
  return (
    <\>
      <h2\>Todo List</h2\>
      <ul\>
        {items.map(todo => {
          <li key={todo\>
            {todo\>}
            <button onClick={() => onDelete(todo)}\>X</button\>
          </li\>
        }
      </ul\>
    </\>
  )
})
function Todo() {
  const [items, setItems] = useState(["item 1", "item 2"])
  ...
  const onDelete = useCallback(
    (item) => setItems(li => li.filter(i => i !== item)),
    []
  )
  ...
}

References