材质UI头像添加海拔

Question

我尝试将海拔（阴影）添加到 MUI Avatar 组件https://material-ui.com/components/avatars/#image-avatars。

<Avatar alt="Cindy Baker" src="/static/images/avatar/3.jpg" />

paper用或Card增加半径包裹 Avatar 。

我还尝试boxShadow使用 makeStyles 和 MUI shadow https://material-ui.com/system/shadows/设置头像，但没有成功。

Answer 1

我已经测试过了，它适用于阴影。这是我的代码：import React from 'react'import { makeStyles } from '@material-ui/styles'import Avatar from '@material-ui/core/Avatar'export default () => {&nbsp; &nbsp; const classes = useClasses()&nbsp; &nbsp; return (&nbsp; &nbsp; &nbsp; &nbsp; <Avatar&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; className={classes.avatar}&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; alt="Cindy Baker"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; src="/static/images/avatar/3.jpg"&nbsp; &nbsp; &nbsp; &nbsp; />&nbsp; &nbsp; )}const useClasses = makeStyles(theme => ({&nbsp; &nbsp; avatar: {&nbsp; &nbsp; &nbsp; &nbsp; boxShadow: theme.shadows[3],&nbsp; &nbsp; }}))

Answer 2

我自己找到了一个替代解决方案：<Avatar component={Paper} elevation={2}>&nbsp; &nbsp; <DirectionsCarIcon /></Avatar>