import * as React from "react"; import Tabs from "@mui/material/Tabs"; import Tab from "@mui/material/Tab"; import Box from "@mui/material/Box"; import { Container } from "@mui/material"; import { useLocation } from "react-router-dom"; import navConfig from "../nav/config"; export default function UserPage() { const [value, setValue] = React.useState("one"); const handleChange = (event, newValue) => { setValue(newValue); }; const location = useLocation(); console.log("===================================="); console.log(location.pathname); console.log("===================================="); const data = React.useMemo(() => { const currouteconfig = navConfig?.filter((it, i) => { return it?.path === location?.pathname; }); return currouteconfig[0]?.children ?? []; }, [location.pathname]); return ( <Container maxWidth="xl"> <Tabs value={value} onChange={handleChange} textColor="secondary" indicatorColor="secondary" aria-label="secondary tabs example" sx={{ height: 64,ml:"-16px" }} > {data?.map((it, i) => ( <Tab value={it?.path+i} label={it?.title} sx={{ height: 64, margin: "0 6px" }} key={i} /> ))} </Tabs> </Container> ); }