From fdbe02791afb99cef065c7a33cefd297c70b9989 Mon Sep 17 00:00:00 2001
From: xuan <w1359774872@gmail.com>
Date: Mon, 13 Mar 2023 17:30:17 +0800
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9E=20fix(=E5=8A=A0=E5=85=A5=E8=B4=AD?=
 =?UTF-8?q?=E7=89=A9=E8=BD=A6):=20=E4=BF=AE=E5=A4=8D=E5=9B=BE=E7=89=87?=
 =?UTF-8?q?=E9=97=AA=E7=83=81=E7=9A=84=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/LabAndImg/index.tsx | 25 ++++++++++++++++++-------
 1 file changed, 18 insertions(+), 7 deletions(-)

diff --git a/src/components/LabAndImg/index.tsx b/src/components/LabAndImg/index.tsx
index ebeadd7..d3d4a4b 100644
--- a/src/components/LabAndImg/index.tsx
+++ b/src/components/LabAndImg/index.tsx
@@ -21,8 +21,6 @@ interface Param {
   suffix?: string
 }
 const LabAndImg = ({ value, onClick, showStatus = false, round = false, name = '', customImageStyle = {}, suffix = '!w200' }: Param) => {
-  const [imgs, setImgs] = useState<string>('')
-
   // lab是否都是0
   const rgbStyle = useMemo(() => {
     if (value?.lab && (value?.lab.l || value?.lab.a || value?.lab.b)) {
@@ -33,12 +31,25 @@ const LabAndImg = ({ value, onClick, showStatus = false, round = false, name = '
     }
   }, [value])
 
-  useEffect(() => {
+  // useEffect(() => {
+  //   if (value?.texture_url) {
+  //     const imgs = value.texture_url.split(',').map((item) => {
+  //       return formatImgUrl(item, suffix)
+  //     })
+  //     setImgs(() => imgs[0])
+  //   }
+  // }, [value])
+
+  const img = useMemo(() => {
+    console.log('update img')
     if (value?.texture_url) {
       const imgs = value.texture_url.split(',').map((item) => {
         return formatImgUrl(item, suffix)
       })
-      setImgs(() => imgs[0])
+      return imgs[0]
+    }
+    else {
+      return ''
     }
   }, [value])
 
@@ -47,14 +58,14 @@ const LabAndImg = ({ value, onClick, showStatus = false, round = false, name = '
     setLabAndImgShow(false)
   }, [])
 
-  const onShowLabAndImg = (e) => {
+  const onShowLabAndImg = () => {
     onClick?.(value)
     if (!showStatus) { return false }
     setLabAndImgShow(true)
   }
 
   const checkLoad = (val) => {
-    setImgs(() => formatImgUrl(''))
+    // setImgs(() => formatImgUrl(''))
   }
 
   return (
@@ -64,7 +75,7 @@ const LabAndImg = ({ value, onClick, showStatus = false, round = false, name = '
           <Image
             lazyLoad
             mode="aspectFill"
-            src={imgs}
+            src={img}
             onError={e => checkLoad(e)}
             className={styles.labAndImg_image}
             style={{ borderRadius: round ? '50%' : '', ...customImageStyle }}