[解決済み】reactjsで生のhtmlをレンダリングする。

質問

つまり、reactjsで生のhtmlをレンダリングする方法はこれだけなのでしょうか？

// http://facebook.github.io/react/docs/tutorial.html
// tutorial7.js
var converter = new Showdown.converter();
var Comment = React.createClass({
  render: function() {
    var rawMarkup = converter.makeHtml(this.props.children.toString());
    return (
      <div className="comment">
        <h2 className="commentAuthor">
          {this.props.author}
        </h2>
        <span dangerouslySetInnerHTML={{__html: rawMarkup}} />
      </div>
    );
  }
});

JSXでマークアップするクールな方法があることは知っていますが、私は主に生のhtml（すべてのクラス、インラインスタイルなど）をレンダリングできることに関心を持っています。このような複雑なものです。

<!-- http://getbootstrap.com/components/#dropdowns-example -->
<div class="dropdown">
  <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-expanded="true">
    Dropdown
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Another action</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Something else here</a></li>
    <li role="presentation"><a role="menuitem" tabindex="-1" href="#">Separated link</a></li>
  </ul>
</div>

それを全部JSXで書き直すのは、ちょっと勘弁してほしいですね。

もしかしたら、私の考え方が間違っているのかもしれません。ご指摘をお願いします。

どのように解決するのですか？

を活用することができます。 html-to-react npmモジュールです。

注：このモジュールの作者は私であり、数時間前に公開したばかりです。バグや使い勝手の問題があれば、遠慮なくご報告ください。