How can we get value of selected menu item in Ant Design?

Question

Sandbox Link

I want to display the name of the selected item on the button.

Currently, the button says Select User Name but when someone selects a name, that name should be displayed instead.

Answer 1

Try this , it works for me

const App = () => {
const [itemName, setItemName] = useState("Select User Name");
const items = [
   { key: "1", label: "John" },
   { key: "2", label: "Peepo" },
   { key: "3", label: "Patel" },
   { key: "4", label: "Soukup" }
];
const menu = (
   <Menu
     items={items}
     onClick={({ key }) => {
         setItemName(items.find((elm) => elm.key === key).label);
     }}
   />
 );