小编Ami*_*imi的帖子

我正在尝试在材质 UI 组件之上进行组合，仅通过给定的道具更改样式。

import { Typography } from "@mui/material";
import { styled } from "@mui/system";

type MyTypographyExtraProps = { isEven?: boolean };

export const MyTypography = styled(Typography)<MyTypographyExtraProps>(
  ({ theme, isEven }) => `
   color: ${theme.palette.common.black};

   ::after {
      content: "";
      display: inline-block;
      height: ${theme.spacing(2)};
      width: ${theme.spacing(2)};
      border-radius: ${theme.spacing(2)};
      background-color: ${theme.palette[isEven ? "success" : "error"].main};
   }
  `,
);

styled 函数将我的isEvenprops 传递给 Material Typography 组件，Typography 将其传递给 DOM，所以我收到警告

警告：React 无法识别isEvenDOM 元素上的 prop。如果您有意希望它作为自定义属性出现在 DOM 中，请将其拼写为小写iseven。如果您不小心从父组件传递了它，请将其从 DOM 元素中删除。

在传递给版式元素之前如何省略类型？

我可以制作另一个组件并消除该层中的道具，但我很想知道是否有任何方法可以在没有额外组件的情况下做到这一点。