我正在将React与Ant Design一起使用，但这只是一个React问题。
我有这样的代码：
{
title: "Group",dataIndex: "group",key: "group",render: text => (
<a> {text} </a>
)
}
不是render: text => ()，它允许我在js函数（或jsx？）中使用html
但是，如果我尝试使用if / else逻辑，则总是会出错。
现在我正在使用像这样的愚蠢的东西：
render: texts => (
<span>
{[""].map(text => {
if(texts.includes(":")) {
return (<b> {texts} </b>)
}
return (<a> {texts} </a>)
})}
</span>
问题是，有没有一种方法可以不使用[""].map()呢？如果不行，为什么不简单
您不能在JSX内使用if/else，但可以在返回一些JSX之前在JSX内使用三元表达式或在函数内使用if/else条件。这是两个示例：
{
render: texts => (
<span>
{
texts.includes(":")
? <b> {texts} </b>
: <a> {texts} </a>
}
</span>
),otherRender: texts => {
if (texts.includes(":")) {
return (
<span><b> {texts} </b></span>
)
}
return (
<span><a> {texts} </a></span>
)
}
}
为什么不可能：
一个表达式产生一个值...一个语句执行一个动作。
{}语法允许Embedding Expressions in JSX，但不允许嵌入语句if是一个声明等效表达式，使用conditional operator代替if：
render: texts => (
<span>
{texts.includes(":")
? <b>{texts}</b>
: <a>{texts}</a>
}
</span>
)