如何将日期字符串数组转换为含不同配置的键值对象数组？

给定日期字符串数组：

const dates = ["2022-12-01", "2022-12-02", "2022-12-03", "2022-12-04"];

要转换成每个元素为日期键、对应专属配置的对象数组，可通过以下两种方式实现：

方式一：switch匹配日期 #

先确保自定义样式已提前定义：

// 预先定义的自定义样式
const customDateStyle2 = { /* 你的样式内容 */ };
const customDateStyles = { /* 你的样式内容 */ };

遍历数组生成目标结构：

const result = dates.map(date => {
  switch(date) {
    case "2022-12-01":
      return {
        [date]: {
          disableTouchEvent: true,
          selected: true,
          selectedColor: "#ffff",
          selectedTextColor: "grey"
        }
      };
    case "2022-12-02":
      return {
        [date]: {
          disableTouchEvent: true,
          selected: true,
          selectedColor: "#3634A3",
          selectedTextColor: "#ffff"
        }
      };
    case "2022-12-03":
      return {
        [date]: {
          disableTouchEvent: true,
          customStyles: customDateStyle2,
          selected: true,
          selectedColor: "#ffff"
        }
      };
    case "2022-12-04":
      return {
        [date]: {
          disableTouchEvent: true,
          customStyles: customDateStyles,
          selected: true,
          selectedColor: "#ffff"
        }
      };
    default:
      return {};
  }
});

方式二：配置映射表（更易维护） #

先定义日期与配置的映射关系，再批量生成结果：

// 预先定义的自定义样式
const customDateStyle2 = { /* 你的样式内容 */ };
const customDateStyles = { /* 你的样式内容 */ };

// 日期-配置映射表
const dateConfigMap = {
  "2022-12-01": {
    disableTouchEvent: true,
    selected: true,
    selectedColor: "#ffff",
    selectedTextColor: "grey"
  },
  "2022-12-02": {
    disableTouchEvent: true,
    selected: true,
    selectedColor: "#3634A3",
    selectedTextColor: "#ffff"
  },
  "2022-12-03": {
    disableTouchEvent: true,
    customStyles: customDateStyle2,
    selected: true,
    selectedColor: "#ffff"
  },
  "2022-12-04": {
    disableTouchEvent: true,
    customStyles: customDateStyles,
    selected: true,
    selectedColor: "#ffff"
  }
};

// 生成目标数组
const result = dates.map(date => ({ [date]: dateConfigMap[date] || {} }));

两种方式最终都会生成你需要的目标结构，方式二更适合后续扩展或修改配置。

内容的提问来源于stack exchange，提问作者harika