使用erb和Ruby块语法进行JSX集成反应 [英] React JSX integration with erb and Ruby block syntax

问题描述

在我的 app / assets / javascripts / components / navbar.js.jsx.erb 中，我可以在组件的render函数中编写类似的代码（使用宝石反应轨道）：

< pre class = lang-js prettyprint-override> 类Navbar扩展了React.Component {
render（）{
return（
< div className = navbar -header>
< ul>
< li>
<％= link_to root_path，className：'navbar-brand'do％>
< span className ='glyphicon glyphicon-home'< / span>
& nbsp;
<％= I18n.t（'menu.now'）％>
< ％end％>
< / li>
< li><％= link_to I18n.t（'menu.archive'），archive_path％< // li>
< / ul>
< / div>
）；
}
}


除 link_to 带块，这给了我一个语法错误：

语法错误，意外的keyword_end，期望'） '

如果我删除该块，则一切正常。知道吗？

PS：要使用Rails助手，我已经在 config / initializers / assets.rb ：

 ＃在资产管道中包括Rails帮助器
 Rails.application.config.assets.configure do | env | 
 env.context_class.class_eval做
包括ActionView :: Helpers 
包括Rails.application.routes.url_helpers 
结束
结束
  




解决方案

在github react-rails页面上，有人对此问题有答案，请参见以下评论： https://github.com/reactjs/react-rails/issues/211#issuecomment -178119941

In my app/assets/javascripts/components/navbar.js.jsx.erb I can write something like this in the render function of my component (I'm using the gem react-rails):

class Navbar extends React.Component {
  render() {
    return(
      <div className="navbar-header">
        <ul>
          <li>
            <%= link_to root_path, className: 'navbar-brand' do %>
              <span className='glyphicon glyphicon-home'></span>
              &nbsp;
              <%= I18n.t('menu.now') %>
            <% end %>
          </li>
          <li><%= link_to I18n.t('menu.archive'), archive_path%></li>
        </ul>
      </div>
    );
  }
}

All works fine except for the link_to with block, which gives me a syntax error:

syntax error, unexpected keyword_end, expecting ')'

If I remove the block all works fine. Any idea?

PS: To use the Rails helpers, I have added these lines in config/initializers/assets.rb:

# Include Rails helpers in the assets pipeline
Rails.application.config.assets.configure do |env|
  env.context_class.class_eval do
    include ActionView::Helpers
    include Rails.application.routes.url_helpers
  end
end

解决方案

On the github react-rails page someone have answer at this question, see this comment: https://github.com/reactjs/react-rails/issues/211#issuecomment-178119941

这篇关于使用erb和Ruby块语法进行JSX集成反应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！