时间戳

首页 > 解决方案 > Material-UI在没有图像时显示字母头像

reactjs - Material-UI在没有图像时显示字母头像

问题描述

我正在使用 Material-UI Avatar React 组件来显示个人资料图像。当给定 url 没有图像时，我需要显示字母头像。我怎样才能做到这一点？

<Avatar src={ProfileImageUrl} className={classes.avatar}>
   {userDetails.fistname.charAt(0)+" "+userDetails.lastname.charAt(0)}
</Avatar>

标签： reactjsmaterial-uiavatar

解决方案

Avatar 组件本身有一个替代属性，如标准img标签

   <Avatar alt="avatar" src={ProfileImageUrl} className={classes.avatar}>
       {userDetails.fistname.charAt(0)+" "+userDetails.lastname.charAt(0)}
    </Avatar>

推荐阅读