ReactJs Card 中的三元运算符 Header

Question

如何在 ReactJS 的 CardHeader 标题中添加三元运算符？我只能写名字不能写姓。

<CardHeader title={(firstName ? firstName : "")(lastName ? lastName : "")} />;

Answer 1

您可以在同一个字符串中使用多个三元运算符：

<CardHeader title={`${(firstName ? firstName : "")} ${(lastName ? lastName : "")}`} />

在你的情况下，我会使用一个函数来生成全名：

const getFullName = () => {
    const name = []
    if(firstName) name.push(firstName)
    if(lastName) name.push(lastName)
    return name.join(' ')
}
// ...
<CardHeader title={getFullName()} />

Answer 2

也许你可以尝试做类似的事情。

<CardHeader title={`${firstName || ''} ${lastName || ''}`} />;