ReactJs组件可以渲染2个表格单元格

Question

我们有一个可以在表格中呈现两个单元格的组件。这显示了一个金额后跟一个类型（如美元，人民币等）。使用该表是因为它允许对数字的正确对齐和面额的左对齐使其更容易阅读。使用colSpan="2"可以轻松添加列标题。问题是，这是命中还是错过。我相信浏览器会过滤掉内部</td><td>。如果我呈现</td><td>_，td元素将不会显示在dom中，但_将会显示。这可能是因为我们被迫从渲染中返回单个html元素，因此我们使用<span>。这会破坏表的HTML有效性，方法如下：<tr><td><span>123.45</td><td>USD</span></td> .... </tr>（其中以下组件呈现中心部分：<span>123.45</td><td>USD</span>）。

因此，就我所知，我们有点坚持使用桌子。在不破坏HTML表格格式的情况下创建2单元格React.Component是一种简单的方法吗？

render() {
  return (
    <span>
      {this.props.amount}
      <span dangerouslySetInnerHTML={{__html: this.props.element_separator}} />
      {this.props.asset.symbol}
    </span>
  )
}