/
githubmirror
/
material-ui
Обзор
Документация
Войти
/
githubmirror
/
material-ui
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
docs/data/material/components/breadcrumbs/CustomSeparator.js
48 строк
1 KB
Siriwat K
[docs] Migrate system props to `sx` prop (#42475)
05 июн 2024, 06:04
Не верифицирован
05 июн 2024, 06:04
6fe1242
Код
Авторство
О чём код?
import * as React from 'react'; import Breadcrumbs from '@mui/material/Breadcrumbs'; import Typography from '@mui/material/Typography'; import Link from '@mui/material/Link'; import Stack from '@mui/material/Stack'; import NavigateNextIcon from '@mui/icons-material/NavigateNext'; function handleClick(event) { event.preventDefault(); console.info('You clicked a breadcrumb.'); } export default function CustomSeparator() { const breadcrumbs = [ <Link underline="hover" key="1" color="inherit" href="/" onClick={handleClick}> MUI </Link>, <Link underline="hover" key="2" color="inherit" href="/material-ui/getting-started/installation/" onClick={handleClick} > Core </Link>, <Typography key="3" sx={{ color: 'text.primary' }}> Breadcrumb </Typography>, ]; return ( <Stack spacing={2}> <Breadcrumbs separator="›" aria-label="breadcrumb"> {breadcrumbs} </Breadcrumbs> <Breadcrumbs separator="-" aria-label="breadcrumb"> {breadcrumbs} </Breadcrumbs> <Breadcrumbs separator={<NavigateNextIcon fontSize="small" />} aria-label="breadcrumb" > {breadcrumbs} </Breadcrumbs> </Stack> ); }