javascript - 如何将来自后端的有效负载响应重新格式化为所需的格式？

Question

如何更改来自 api 的前端有效负载的结构。这是当前的数据结构：

{
  listById: [
    [
      {
        Desc: {
          value: '7777 - Florida Hurricane'
        },
        DSTR_NR: {
          value: '7777'
        }
      },
      {
        Desc: {
          value: '7172 - Virginia Severe Storm(s)'
        },
        DSTR_NR: {
          value: '7172'
        }
      }
    ]
  ]
}

如何将其转换为以下所需的结构？

{
  list: [
    {
      name: '7777',
      value: '7777 - Florida Hurricane'
    },
    {
      name: '7172',
      value: '7172 - Virginia Severe Storm(s)'
    }
  ]
}

这就是我的代码的样子：

formatData = action => {
  const id = action.meta;
  let obj = {...state.listById};
  obj[id] = action.payload;
  let x = {
    ...state,
    listById: Object.values(obj)
  };

  return x;
}

标签： javascriptreactjsecmascript-6

Answer 1

希望它可以帮助一点。

const response = {
  listById: [
    [
      {
        Desc: {
          value: '7777 - Florida Hurricane'
        },
        DSTR_NR: {
          value: '7777'
        }
      },
      {
        Desc: {
          value: '7172 - Virginia Severe Storm(s)'
        },
        DSTR_NR: {
          value: '7172'
        }
      }
    ]
  ]
}
   

 const list
     = response.listById ? 
        response.listById[0]?.map(
          ({Desc: {value}, DSTR_NR: {value: name}}) => ({
              name,
              value
        })) 
    : []
const result = {list: list || []}

console.log(result)