JavaScript无法在多值return语句中访问变量

Question

由于此渲染语句c is not defined的第二部分（在逗号返回后），我的应用程序崩溃了。

我想要不仅将此元素呈现为CategoryTreeFork组件，还要将其作为同一组件呈现给它们。

我在尝试访问该变量时犯了错误吗？

<div className="categories-narabikae">
    <p>Displayed Categories </p>
    {   
        filterActiveCategories(categories).map((c, idx) =>  
            <CategoryTreeFork 
                key={idx}
                parentCat={null}
                thisCat={c}
                level={1}
                dropEvent={this.handleDropEvent}
            />

            ,   

            c.children 
                ? c.children.map( (c2, idx) =>
                <CategoryTreeFork
                    key={idx}
                    parentCat={c}
                    thisCat={c2}
                    level={2}
                    dropEvent={this.handleDropEvent}
                />
            )   
            : null
        )   
    }   
</div>

编辑：看起来在第一次呈现页面时，我映射的数组是空的（尚未从API中检索类别） - 这是否可能触发错误？

Answer 1

  

在第一次呈现页面时，我映射的数组是空的（尚未从API中检索类别） - 这可能会触发错误吗？

您（意外）使用逗号运算符：

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Comma_Operator

  

逗号运算符计算每个操作数（从左到右）并返回最后一个操作数的值。

因此，解释器将忽略第一个CategoryTreeFork;实际上只会使用以逗号分隔的列表中的最后一个值。