Использование реквизита в качестве значения для свойства CSS с makeStyles - PullRequest
0 голосов
/ 21 октября 2019

Я ищу способ использовать определенное значение ( 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;
...