onClick function sider antd
import React, { useState } from "react"; import { Layout } from "antd"; import Sider from "./Sider"; import "./styles.css"; const { Content } = Layout; export default function App() { const style = { fontSize: "30px", height: "100%", display: "flex", alignItems: "center", justifyContent: "center" }; const components = { 1: <div style={style}>Option 1</div>, 2: <div style={style}>Option 2</div>, 3: <div style={style}>Option 3</div>, 4: <div style={style}>Option 4</div> }; const [render, updateRender] = useState(1); const handleMenuClick = menu => { updateRender(menu.key); }; return ( <div className="App"> <Layout style={{ minHeight: "100vh" }}> <Sider handleClick={handleMenuClick} /> <Layout> <Content>{components[render]}</Content> </Layout> </Layout> </div> ); }