ES6中给map处理的数组加额外对象遇TS2339错误求助

DevOps 小满

2026-8-18

问题解决：在数组映射前添加额外选项

原代码

mapFn={response => (response.data && response.data.map(secret => ({
                  label: secret.secretName,
                  value: secret.id
                })))}

尝试的错误写法及报错

尝试在response.data执行映射前添加额外对象，写法如下：

mapFn={response => (response.data &&
                response.data.append({label: "Select Vault ID", value: "value"})
                && response.data.map(secret => ({
                  label: secret.secretName,
                  value: secret.id
                })))}

出现错误：

TS2339: Property 'append' does not exist on type 'SecretSummary[]

错误原因

append是DOM元素的专属方法，数组不存在这个方法，因此TypeScript抛出属性不存在的错误。要给数组添加元素并生成新数组，需要使用数组原生方法或展开运算符。

正确写法

方法1：使用数组展开运算符（推荐）

先构建包含默认选项的数组，再展开原数组元素，最后统一执行映射：

mapFn={response => {
  if (!response.data) return [];
  return [
    { label: "Select Vault ID", value: "value" },
    ...response.data
  ].map(item => ({
    label: item.secretName ?? item.label,
    value: item.id ?? item.value
  }));
}}

方法2：使用`concat`方法

通过concat将默认对象与原数组合并，再进行映射操作：

mapFn={response => (response.data &&
  [{ label: "Select Vault ID", value: "value" }]
    .concat(response.data)
    .map(item => ({
      label: item.secretName ?? item.label,
      value: item.id ?? item.value
    }))
)}