如何在React的Material-UI中仅为elevation为0的Card添加边框？

你可以利用Material-UI组件自带的类名和样式优先级来实现这个需求：Card组件继承自Paper组件，当elevation设为0时，根元素会自动带上MuiPaper-elevation0类，我们可以基于这个类来针对性设置边框样式。

修改后的代码如下：

const theme = createTheme({
  components: {
    MuiCard: {
      styleOverrides: {
        root: {
          position: "relative",
          zIndex: 0,
          // 仅匹配elevation为0的Card
          '&.MuiPaper-elevation0': {
            border: `1px solid green`,
          },
        },
      },
    },
  },
});

这样设置后，只有当Card的elevation属性为0时才会显示绿色边框，其他层级阴影的Card不会受到影响。

内容的提问来源于stack exchange，提问作者Joseph