refactor: default avatar size

This commit is contained in:
zerosoul
2022-04-14 21:28:33 +08:00
parent 506fc8e59a
commit 05da16859f
2 changed files with 10 additions and 5 deletions
+6 -3
View File
@@ -1,9 +1,12 @@
import { useState, useEffect } from "react"; import { useState, useEffect } from "react";
import { getInitials, getInitialsAvatar } from "../utils"; import { getInitials, getInitialsAvatar } from "../utils";
export default function Avatar({ url, name = "unkonw name", ...rest }) { export default function Avatar({ url = "", name = "unkonw name", ...rest }) {
// console.log("avatar url", url); // console.log("avatar url", url);
const [src, setSrc] = useState(""); const [src, setSrc] = useState("");
const handleError = () => { const handleError = (err) => {
if (url) {
console.log("load avatar error", url, err);
}
const tmp = getInitialsAvatar({ const tmp = getInitialsAvatar({
initials: getInitials(name), initials: getInitials(name),
}); });
@@ -19,6 +22,6 @@ export default function Avatar({ url, name = "unkonw name", ...rest }) {
setSrc(url); setSrc(url);
} }
}, [url, name]); }, [url, name]);
if (!src) return null;
return <img src={src} onError={handleError} {...rest} />; return <img src={src} onError={handleError} {...rest} />;
} }
+4 -2
View File
@@ -24,9 +24,11 @@ const StyledMsg = styled.div`
} }
.avatar { .avatar {
cursor: pointer; cursor: pointer;
width: 40px;
height: 40px;
img { img {
width: 40px; width: 100%;
height: 40px; height: 100%;
border-radius: 50%; border-radius: 50%;
} }
} }