小编Moy*_*loy的帖子

在此片段中，我使用 Avatar 组件，但图像并未像 next/image 那样在网站中自动优化

代码片段

const ee = (props: any) => {
  const { colorMode, toggleColorMode } = useColorMode();

  return (
    <Box w="300px" h="400px"  >
      <Flex h="100%" w="100%" flexDir="column" align="center">
        <Avatar shadow='lg' size="xl" mt={5} src={props.image} />
        <Box  shadow='md' w="100%" h="250px"mt={5} rounded="xl" bgColor={colorMode === "light" ? "gray.100" : "gray.600" } >
          <Box  w="100%" h="20%"  p={2}  bgColor={colorMode === "light" ? "gray.200" : "gray.700"} rounded="xl" >
            <Flex  direction="row" justifyContent="space-between" align="baseline" >
              <Flex >
              <Badge  colorScheme="twitter" mr={2} rounded="md" p="1">

                Success
              </Badge>
              <Badge colorScheme="twitter" …