reactjs - jQuery unwrap メソッドに似た、react で div をアンラップします。

Question

React JSXを使用しています。以下に示すように、className="shadow" の div があります。

<div className="main">
  <div className="shadow" style={{backgroundColor: "#FFFFFF"}}>
    <div id="wrapper">
      Hello
    </div>
  </div>
</div>

true または false の特定の条件に基づいて、className="shadow" の div を削除したいが、id="wrapper" の div を含むすべての div をそのまま保持したい。jQueryのunwrap()メソッドのようなもの。以下に書かれていることの効果はありますが、それほど多くのコード行はありません。

  if ( currentPage==="login") {
   <div className="main">
     <div id="wrapper">
       Hello
     </div>
   </div>
}
else {
    <div className="main">
  <div className="shadow" style={{backgroundColor: "#FFFFFF"}}>
    <div id="wrapper">
      Hello
    </div>
  </div>
</div>
}

React.js : Wrapping one component into anotherとHow to pass in a react component into another react component to transclude the first component's content?を確認しました。、しかし、私が探しているものが得られませんでした。