fix: flex container

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-vant",
-  "version": "0.0.25",
+  "version": "0.0.26",
   "description": "React Mobile UI Components base on Vant UI",
   "repository": "https://github.com/3lang3/react-vant.git",
   "main": "lib/index.js",

src/flex/style/index.less

@@ -19,10 +19,10 @@
     &-end {
       justify-content: flex-end;
     }
-    &-space-between {
+    &-between {
       justify-content: space-between;
     }
-    &-space-around {
+    &-around {
       justify-content: space-around;
     }
   }

src/image/PropsType.ts

@@ -8,6 +8,7 @@ export interface ImageProps extends BaseTypeProps {
   alt?: string;
   fit?: ImageFit;
   round?: boolean;
+  block?: boolean;
   width?: number | string;
   height?: number | string;
   radius?: number | string;

src/image/index.tsx

@@ -13,9 +13,10 @@ const Image: React.FC<ImageProps> = (props) => {
     loadingIcon = 'photo',
     showError = true,
     showLoading = true,
+    block = true,
   } = props;
   const [status, setStatus] = useState({ loading: true, error: false });
-  const mountedRef = useRef(false)
+  const mountedRef = useRef(false);
 
   const style = useMemo(() => {
     // eslint-disable-next-line @typescript-eslint/no-shadow
@@ -39,24 +40,24 @@ const Image: React.FC<ImageProps> = (props) => {
 
   useEffect(() => {
     if (!mountedRef.current) {
-      mountedRef.current = true
-      return
+      mountedRef.current = true;
+      return;
     }
     setStatus({ error: false, loading: false });
   }, [props.src]);
 
   const onLoad = (e) => {
     setStatus((v) => ({ ...v, loading: false }));
-    props.onLoad?.(e)
+    props.onLoad?.(e);
   };
 
   const onError = (e) => {
     setStatus({ error: true, loading: false });
-    props.onLoad?.(e)
+    props.onLoad?.(e);
   };
 
   const renderLoadingIcon = () => {
-    if (typeof loadingIcon !== 'string') return loadingIcon
+    if (typeof loadingIcon !== 'string') return loadingIcon;
     return (
       <Icon
         size={props.iconSize}
@@ -68,7 +69,7 @@ const Image: React.FC<ImageProps> = (props) => {
   };
 
   const renderErrorIcon = () => {
-    if (typeof errorIcon !== 'string') return errorIcon
+    if (typeof errorIcon !== 'string') return errorIcon;
     return (
       <Icon
         size={props.iconSize}
@@ -107,7 +108,7 @@ const Image: React.FC<ImageProps> = (props) => {
   };
 
   return (
-    <div className={classnames(bem({ round: props.round }))} style={style}>
+    <div className={classnames(bem({ block, round: props.round }))} style={style}>
       {renderImage()}
       {renderPlaceholder()}
       {props.children}

src/image/style/index.less

@@ -4,6 +4,12 @@
   position: relative;
   display: inline-block;
 
+  &--block {
+    display: block;
+    width: 100%;
+    height: 100%;
+  }
+
   &--round {
     overflow: hidden;
     border-radius: 50%;