refactor: default avatar size
This commit is contained in:
@@ -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} />;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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%;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user