【小話】　MUIのAvatarが賢い件

サムネがある場合にはサムネを、ない場合には404とか何かしらの画像またはアイコンを表示する的なことってよくあると思うんですが、Vueでやってた時はif分岐させていたりしたのでreactもそうかなーと思ったらMUI賢かった。

CloudFrontとかで鍵つけてるリソースのurlをsrcに設定した時でかつ認証情報を持っていないと画像リンクアクセス時に403が帰るがその時点で特にハンドリングしなくても、アバターがデフォで表示される。

お手軽にお試ししたい場合には下記で。

sample.tsx

<>
  <Avatar src="https://gazou.com/mukou.jpeg" /> 
  <Avatar src="https://picsum.photos/200/300" />
</>

便利やな〜