基于固定的SKU數(shù)據(jù)結(jié)構(gòu)的組合皆看，輸出A仓坞、B、C等系列的多類組合腰吟。

function generateCombinations(source) {
      const combinations = [];

      function generateHelper(index, current, spDataList) {
        if (index === source.length) {
          combinations.push({...current, spDataList, spData: JSON.stringify(spDataList)});
          return;
        }

        const item = source[index];

        for (let i = 0; i < item.inputSelectArr.length; i++) {
          const newCurrent = {...current};
          newCurrent[`id_${item.id}`] = item.inputSelectArr[i].value;
          newCurrent.enable = 1

          if (index == 0)
            newCurrent.pic = item.inputSelectArr[i].pic;

          const newSpData = [...spDataList, {key: item.name, value: item.inputSelectArr[i].value}];
          generateHelper(index + 1, newCurrent, newSpData);
        }
      }

      generateHelper(0, {}, []);
      return combinations;
    }

那如果需要通過組合后的數(shù)據(jù)來反轉(zhuǎn)原始數(shù)據(jù)呢无埃？

我們來看下：

1、首先毛雇，觀察生成的組合列表嫉称，找到其中的共同點(diǎn)和區(qū)別。從代碼中可以看出禾乘，生成的每個(gè)組合都包含以下幾個(gè)屬性：

id_${item.id}：表示某個(gè)輸入項(xiàng)的選中值澎埠；
spDataList：表示整個(gè)組合的所有輸入項(xiàng)及其選中值虽缕；
spData：表示 spDataList 序列化后的字符串始藕；
enable：表示該組合是否可用；
pic：表示組合對應(yīng)的圖片路徑氮趋。

可以看到伍派，每個(gè)組合都包含一個(gè)輸入項(xiàng)的選中值，而輸入項(xiàng)有多個(gè)剩胁，每個(gè)輸入項(xiàng)有多個(gè)選項(xiàng)诉植，因此需要確定原始數(shù)據(jù)結(jié)構(gòu)中輸入項(xiàng)和其選項(xiàng)的屬性。

2昵观、其次晾腔，確定原始數(shù)據(jù)結(jié)構(gòu)中輸入項(xiàng)和其選項(xiàng)的屬性。從代碼中可以看出啊犬，原始數(shù)據(jù)結(jié)構(gòu)應(yīng)該包含一個(gè)數(shù)組灼擂，每個(gè)數(shù)組元素代表一個(gè)輸入項(xiàng)，其中每個(gè)輸入項(xiàng)應(yīng)該包含以下屬性：

id：表示該輸入項(xiàng)的唯一標(biāo)識符觉至；
name：表示該輸入項(xiàng)的名稱剔应；
inputSelectArr：表示該輸入項(xiàng)的選項(xiàng)，是一個(gè)數(shù)組语御，每個(gè)數(shù)組元素代表一個(gè)選項(xiàng)峻贮，其中每個(gè)選項(xiàng)應(yīng)該包含以下屬性：
value：表示該選項(xiàng)的值；
pic：表示該選項(xiàng)對應(yīng)的圖片路徑应闯。

3纤控、最后，根據(jù)生成的組合列表和確定的原始數(shù)據(jù)結(jié)構(gòu)碉纺，反推原始數(shù)據(jù)結(jié)構(gòu)船万。根據(jù)組合列表中的 spDataList 屬性细层，可以確定原始數(shù)據(jù)結(jié)構(gòu)中的每個(gè)輸入項(xiàng)的名稱和對應(yīng)的選項(xiàng)值；根據(jù)組合列表中的 enable 屬性唬涧，可以確定原始數(shù)據(jù)結(jié)構(gòu)中每個(gè)組合是否可用疫赎；根據(jù)組合列表中的 pic 屬性，可以確定原始數(shù)據(jù)結(jié)構(gòu)中每個(gè)組合對應(yīng)的圖片路徑碎节。

代碼如下：

function reverseGenerateCombinations(combinations) {
  // 從第一個(gè)組合中獲取輸入項(xiàng)的名稱
  const inputNames = combinations[0].spDataList.map(data => data.key);

  // 根據(jù)輸入項(xiàng)名稱創(chuàng)建空的輸入項(xiàng)列表
  const inputs = inputNames.map(name => ({ id: name, name, inputSelectArr: [] }));

  // 遍歷每個(gè)組合捧搞，獲取每個(gè)輸入項(xiàng)的選項(xiàng)值和對應(yīng)的圖片路徑
  combinations.forEach(({ spDataList, enable, pic }) => {
    spDataList.forEach(({ key, value }) => {
      // 找到對應(yīng)的輸入項(xiàng)
      const input = inputs.find(input => input.id === key);
      // 如果該選項(xiàng)還不存在，則添加該選項(xiàng)
      if (!input.inputSelectArr.some(option => option.value === value)) {
        input.inputSelectArr.push({ value, pic });
      }
    });
  });

  return inputs;
}