时间戳

首页 > 解决方案 > 条件对象作为数组值

javascript - 条件对象作为数组值

问题描述

我正在尝试实现以下目标：
在 React 中，我有一个组件，其中一个 prop 采用一个带有对象的数组，然后该组件在下拉菜单项中显示这些对象。
我想有条件地制作一些这些下拉菜单项。换句话说：一些用户可能会看到一个下拉项目，而其他用户则不会。

实现这一目标的正确方法是什么？我尝试使用扩展运算符（根据此Answer，但我不断收到错误 消息

TypeError: Invalid attempt to spread non-iterable instance

我究竟做错了什么？

我的代码：

<Dropdown
    type="link"
    itemsObject={
       [...states.all.map(state => ({
           value: state.name,
           onClick: () => {
               this.updateCandidate(candidate, {state_id: state.id})
           }
        })),
        {
            isDivider: true
        },
        {
            value: "Notities bewerken",
            onClick: () => {
                this.openCandidateModel(candidate)
            }
        },
        ...(candidate.state.id === 2 ? [{
                value: "Afspraak beheren",
                onClick: () => {
                    this.openCandidateModel(candidate)
                }
           }] : undefined)
    ]}
/>

标签： javascriptreactjs

解决方案

您正在尝试传播undefined. candidate.state.id !== 2将其更改为：

...(candidate.state.id === 2 ? [{
                value: "Afspraak beheren",
                onClick: () => {
                    this.openCandidateModel(candidate)
                }
           }] : [])

此外，可能值得一提的{...undefined}是有效但[...undefined]不是：Spreading undefined in array vs object

推荐阅读