feat(Sku): sku image preview (#4236)

src/sku/Sku.js

@@ -191,17 +191,17 @@ export default createComponent({
       const imageList = [this.goods.picture];
 
       if (this.skuTree.length > 0) {
-        const treeItem = this.skuTree.filter(item => item.k_s === 's1')[0] || {};
-
-        if (!treeItem.v) {
-          return imageList;
-        }
-
-        treeItem.v.forEach(vItem => {
-          const img = vItem.imgUrl || vItem.img_url;
-          if (img) {
-            imageList.push(img);
+        this.skuTree.forEach(treeItem => {
+          if (!treeItem.v) {
+            return;
           }
+
+          treeItem.v.forEach(vItem => {
+            const img = vItem.imgUrl || vItem.img_url;
+            if (img) {
+              imageList.push(img);
+            }
+          });
         });
       }
 

src/sku/components/SkuHeader.tsx

@@ -17,19 +17,22 @@ export type SkuHeaderProps = {
 
 const [createComponent, bem] = createNamespace('sku-header');
 
-function getSkuImg(sku: SkuData, selectedSku: SelectedSkuData) {
-  const id = selectedSku.s1;
+function getSkuImg(sku: SkuData, selectedSku: SelectedSkuData): string | undefined {
+  let img;
 
-  if (id) {
-    // skuImg 挂载在 skuTree 中 s1 上
-    const treeItem = sku.tree.filter(item => item.k_s === 's1')[0] || {};
-    if (treeItem.v) {
-      const matchedSku = treeItem.v.filter(skuValue => skuValue.id === id)[0];
-      if (matchedSku) {
-        return matchedSku.imgUrl || matchedSku.img_url;
-      }
+  sku.tree.some(item => {
+    const id = selectedSku[item.k_s];
+
+    if (id && item.v) {
+      const matchedSku = item.v.filter(skuValue => skuValue.id === id)[0] || {};
+      img = matchedSku.imgUrl || matchedSku.img_url;
+      return img;
     }
-  }
+
+    return false;
+  });
+
+  return img;
 }
 
 function SkuHeader(

src/sku/type.ts

@@ -47,7 +47,4 @@ export type SkuGoodsData = {
   picture: string;
 };
 
-export type SelectedSkuData = {
-  s1: string;
-  s2: string;
-};
+export type SelectedSkuData = Record<string, string>;