react-railsにおいてJSX内にasset_pipelineの画像パスを挿入する

状況

railsのasset_pipelineのことはあまり理解していないが、react-railsで開発を行っている時につまづくポイントがあった。
railsでは画像のパスを直接参照するのではなく、hash値などをつけて参照しているっぽい。（cashとかの関係？そこらへんは今後勉強）
なのでreact内から画像を読もうとしても簡単には読めず、rails側から”asset_path(‘画像の名前’)”などでパスを受け取ってimgタグの部分までpropsで渡していたが、階層が深くなるにつれて無駄な記述が目立つようになってきた・・・。

解決策

調べてみると、このようなGemを発見した。
react-rails-img
このソースを見ていくうちにjsxファイルにrubyコードを埋め込めるらしいのでその方針でとりあえず実装することにした。まだ変更したばかりなので本番環境での動作などは検証していない。

例） Component.js.jsx.erb

var Component = React.createClass({
  render: function() {
    return (
      <img src="<%= asset_path('test.jpg') %>"/>
    );
  }
});