如何打印html文本取决于条件使用reactJs?

Question

这里有一个简单的问题:

<Row>
{ "Client : " && elt.client?.libelle}
</Row>

如果我喜欢的话。客户端已定义，显示:

Client: Client libelle

Answer 1

不知道你到底是什么意思，但也许这有帮助?

<Row>
{elt.client ? elt.client.libelle : elseStatement}
</Row>

含义:' if (elt.client) {返回elt.client.libelle} else {返回"任何你想要的东西";}

Answer 2

您可以使用三元运算符(?和:)。这个操作符经常被用作if…else语句。

<Row>
{ elt?.client?.libelle ? ("Client : " + elt.client.libelle) : "" }
</Row>

它接受三个操作数:一个条件后面跟一个问号(?)，如果条件为真则执行一个表达式，后面跟一个冒号(:)，如果条件为假则执行一个表达式。

另外，你可以使用JavaScript的可选链接(?.)操作符，它可以防止引用为null (null或undefined)时出现错误。

在这种情况下，如果elt是undefined，它不会抛出错误。因此，如果所有elt,elt.client和elt.client.libelle都被定义，且值不为空，则";Client: "+ elt.client.libelle将显示。