Я ищу способ использовать определенное значение ( borderRadius ), извлеченное из реквизита детей в CSS-свойство makeStyles из пользовательского интерфейса материала.
Но я получаю этоошибка:
печать ошибки
на родительском :
...
<Grid item xs={9}>
<Grid container justify="flex-end">
<MenuSideNavbar borderRadius={borderRadius}></MenuSideNavbar>
</Grid>
</Grid>
...
на дочернем :
import React from "react";
import { Box } from "@material-ui/core";
import { makeStyles, createStyles } from "@material-ui/core/styles";
interface ComponentProps {
borderRadius: string;
}
type Props = ComponentProps;
const useStyles = makeStyles(Theme =>
createStyles({
root: {
borderTopRightRadius: ({ borderRadius }) => borderRadius,
background: Theme.palette.secondary.main,
width: "100%"
},
container: {}
})
);
const MenuSideNavbar: React.FC<ComponentProps> = props => {
const { borderRadius, ...other } = props;
const classes = useStyles({ borderRadius });
return (
<Box className={classes.root}>
<p>oi</p>
</Box>
);
};
export default MenuSideNavbar;