传播运算符不适用于本机反应

Question

'browsed' 是一个 object 的数组，每个字母都有数据：

[
    {
        allowMultiSign: undefined,
        allowSingleSign: "1",
        assignmentStatus: "Browsed",
        disclaimer: null,
        form16: false,
        letterDate: "06-Mar-2020",
        title: "letter02",
        safetyLetterId: 987
    },
    {
        allowMultiSign: undefined,
        allowSingleSign: "1",
        assignmentStatus: "Browsed",
        disclaimer: null,
        form16: false,
        letterDate: "06-Mar-2020",
        title: "letter01",
        safetyLetterId: 123
    },
    {
        allowMultiSign: undefined,
        allowSingleSign: "1",
        assignmentStatus: "Browsed",
        disclaimer: null,
        form16: false,
        letterDate: "06-Mar-2020",
        title: "letter03",
        safetyLetterId: 456
    },
    {
        allowMultiSign: undefined,
        allowSingleSign: "1",
        assignmentStatus: "Browsed",
        disclaimer: null,
        form16: false,
        letterDate: "06-Mar-2020",
        title: "letter04",
        safetyLetterId: 789
    }
]

我想：

过滤此数组以查找 form16 false 和 multisign true 的字母
为每个通过过滤器的字母创建一个 object，仅包含字母 ID 和标题
在一个名为 multisign

1 和 2 工作正常（我已经记录了每个步骤）。问题出在#3

当我记录最终结果 -- 多重签名时，我只看到最后一个 object。我期待在 multisign 中看到所有 4 object。

我以前使用展开运算符来完成同样的任务。我想知道我是否只是遗漏了一个小细节，或者这是一个兼容性问题。我正在使用 javascript 6.9.0.

            let multisign = {};
            browsed.forEach(letter => {
                if (letter.form16 == false && letter.allowMultiSign != false) {
                    let idAndTitle = {
                        safetyLetterId: letter.safetyLetterId,
                        title: letter.title
                    }
                    multisign = { ...multisign, ...idAndTitle }
                }
            });

            console.log(multisign);
        }

示例输出

{
    {
        safetyLetterId: 789,
        title: "letter04"
    }
}

Answer 1

我不太确定你想要达到什么目的，而且你似乎对 javascript 的经验较少。

但在查看代码后，我的感觉是您正在尝试过滤将 form16 设置为 false 并将 allowMultiSign 设置为 true 的字母对象。如果是这种情况，请尝试以下操作：

            let multisign = [];
            browsed.forEach(letter => {
                if (letter.form16 == false && letter.allowMultiSign != false) {
                    let idAndTitle = {
                        safetyLetterId: letter.safetyLetterId,
                        title: letter.title
                    }
                    multisign.push(idAndTitle);
                }
            });

            console.log(multisign);

Answer 2

发生这种情况是因为当您使用相同的键传播对象时，它们会被覆盖，请参阅：multisign = { ...multisign, ...idAndTitle }

这就是为什么你只得到最后一个。

我的建议是要么制作一个数组并将对象推入其中，要么您必须转换 idAndTitle 每个对象的键（可能附加一些索引）

编辑：

如果要更改键，则必须更改 idAndTitle 对象

browsed.forEach((letter, index) => {
                if (letter.form16 == false && letter.allowMultiSign != false) {
                   let idAndTitle = {
                        [`safetyLetterId${index}`]: letter.safetyLetterId,
                        [`title${index}`]: letter.title
                    }
...

现在多重签名对象应该如下所示

{
  {
    safetyLetterId0: '...'
    title0: '...'
  },
  {
    safetyLetterId1: '...'
    title1: '...'
  },
  ...
}

如您所见，这有点丑陋，所以我建议用数组替换 multisign 并将新对象推送到它

传播运算符不适用于本机反应

spread operator not working in react native

dictionary

concat

object

ecmascript-6

react-native