使用阵营JSX，我有一个数组levels可以包含阵列的一个或多个级别的一个名称，例如：one，two和three。在我的渲染函数中，我可以调用{renderLevels}渲染所有用逗号分隔的关卡。
这有效：
const renderLevels = levels.map((item, index) => {
return (
<Fragment key={index}>
{(index ? ' & ' : '')} {item.name}
</Fragment>
)
}
);
如果存在所有级别，则我要呈现“所有级别”，而不是逗号分隔的列表。在其他所有情况下，我都需要列表。因此，我更改了代码。
这不起作用：
const renderLevels = () => {
if (levels.length === 3) {
return (
'all levels'
)
}
levels.map((item, index) => {
return (
<Fragment key={index}>
{(index ? ' & ' : '')} {item.name}
</Fragment>
)
}
)
};
我const现在是一个函数，然后使用调用{renderLevels()}。问题：少于3个级别时，不再返回项目名称列表。如果少于3个级别，我的if语句会起作用，并且console.log(item.name)内部.map会向我显示结果。但是，没有获取返回值。我究竟做错了什么？
您错过return了levels.map()。当前，您只是在if块内返回该函数，if但未执行任何操作都没有返回任何内容。
const renderLevels = () => {
if (levels.length === 3) {
return (
'all levels'
)
}
return levels.map((item, index) => {
return (
<Fragment key={index}>
{(index ? ' & ' : '')} {item.name}
</Fragment>
)
}
)
};
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句