Javascript 使用三元条件将html附加到ReactJS中的状态变量

我正在检查一个字符串是否为空，如果不是，我还想向它附加一些html。然而，我尝试的似乎是将整个语句转换为字符串，而不是将其包装在div中。下面是我尝试的两种方法

var myVar = this.state.myString == '' ? '': '<div>'+this.state.myString+'</div>';
return(
   {myVar}
);

var myVar = this.state.myString == '' ? '': {'<div>'+this.state.myString+'</div>'};
return(
   <div className="container">
       {myVar}
   </div>
);

---

var myVar=this.state.myString==“”？“”+this.state.myString+''；
返回(
{myVar}
);
var myVar=this.state.myString==''？''：{''+this.state.myString+''}；
返回(
{myVar}
);

我只想显示一些存在的东西

---

我尝试返回状态，然后将其包装在return（）中的html标记中；但是对于按钮，它会显示一个带有bootstraps.btn类的灰色斑点。

当您创建jsx元素时，您不是在创建字符串，而是在创建函数（在引擎盖下）。在jsx元素之间，可以在花括号之间绑定数据

var someElement = <div>{ this.state.myString }</div>

---

当您创建jsx元素时，您不是在创建字符串，而是在创建函数（在后台）。在jsx元素之间，可以在花括号之间绑定数据

var someElement = <div>{ this.state.myString }</div>

---

有趣。我要说的是，当将某个值与虚假值进行比较时，不需要“==”。同样的事情也可以写在你说你想附加。。原始值是多少，期望的结果是什么？您没有在提供的示例中附加任何内容。..var myVar=this.state.myString？“div'+this.state.homeTeamRuns+'div'：''；此外，homeTeamRuns中存储的数据类型是什么？它是字符串吗？为了清晰起见进行了编辑。是的，homeTeamRuns只是一个有趣的例子。我要说的是，当将某个值与虚假值进行比较时，不需要“==”。同样的事情也可以写在你说你想附加。。原始值是多少，期望的结果是什么？您没有在提供的示例中附加任何内容。..var myVar=this.state.myString？“div'+this.state.homeTeamRuns+'div'：''；此外，homeTeamRuns中存储的数据类型是什么？它是字符串吗？为了清晰起见进行了编辑。是的，homeTeamRuns只是一个字符串

render() {
  return (
    <div>
      { this.state.myString !== '' && // if string is not empty add this div
      <div>{ this.state.myString }</div>
      }
    </div>
  )
}

{ !!this.state.myString && <div>{ this.state.myString }</div> }