Ruby on rails Rails和React,如何使用帮助程序和方法?

Ruby on rails Rails和React,如何使用帮助程序和方法?,ruby-on-rails,reactjs,Ruby On Rails,Reactjs,如何在rails中使用rails助手?例如,_post.haml partial如下所示 %ul#comments-list.comments-list{:data => { post: post.id }} %li .comment-main-level .comment-avatar = post_avatar(post) .comment-box .comment-head %h6.comment

如何在rails中使用rails助手?例如,_post.haml partial如下所示

%ul#comments-list.comments-list{:data => { post: post.id }}
  %li
    .comment-main-level
      .comment-avatar
        = post_avatar(post)
      .comment-box
        .comment-head
          %h6.comment-name.by-author
            = link_to full_name(post.user), post.user
          %span="#{post.created_at.strftime("%D:%H:%M:%S")}"
          - if user_signed_in?
            %i= post_options(post, current_user)
            %i=votes(post, current_user, post)
        .comment-content
          .pop
            = check_string(post.content)
  = div_for(post.reviews.includes(:user)) do |review| 
    = render review
  = render 'welcome/modal'
我试着将其放入react组件:

{ div, h2, a, p, input, ul, li, span, h6, img, span } = React.DOM
@Post = React.createClass


  render: ->
    div {},
      ul
        className: 'comments-list'
        id: 'comments-list'
        li null,
          div className: 'comment-main-level',
            div className: 'comment-avatar',
              img
                className: 'group-post-img media-object'
                src: @props.user.img_url
            div className: 'comment-box',
              div className: 'comment-head',
                h6 className: 'comment-name by-author',
                  a
                    href: @props.user.first_name
                    @props.user.first_name +  ' ' +@props.user.last_name
                span null, @props.post.created_at
= react_component('Post', { 
    post: @post,
    userSignedIn: user_signed_in?,
    postOptions: post_options(post, current_user),
    votes: votes(post, current_user, post)
})
如何实现这一部分

- if user_signed_in?
    %i= post_options(post, current_user)
    %i=votes(post, current_user, post)

这是Desive helper,也是我自己的helper,它包含链接(带有if-else条件)。我不知道如何在React中实现这一点。有人能告诉我如何解决这样的问题吗?

将助手方法的结果作为
道具传递给组件:

{ div, h2, a, p, input, ul, li, span, h6, img, span } = React.DOM
@Post = React.createClass


  render: ->
    div {},
      ul
        className: 'comments-list'
        id: 'comments-list'
        li null,
          div className: 'comment-main-level',
            div className: 'comment-avatar',
              img
                className: 'group-post-img media-object'
                src: @props.user.img_url
            div className: 'comment-box',
              div className: 'comment-head',
                h6 className: 'comment-name by-author',
                  a
                    href: @props.user.first_name
                    @props.user.first_name +  ' ' +@props.user.last_name
                span null, @props.post.created_at
= react_component('Post', { 
    post: @post,
    userSignedIn: user_signed_in?,
    postOptions: post_options(post, current_user),
    votes: votes(post, current_user, post)
})
在组件中,在返回DOM之前使用条件:

var Post = React.createClass({
    render: function() {
        var postDetails;
        if(this.props.userSignedIn) {
            postDetails = 
                <div className="shown-when-logged-in">
                    <i>{this.props.postOptions}</i>
                    <i>{this.props.votes}</i>
                </div>
        }

        return (
            <div>
                <div className="always-shown">
                    {this.props.post.content}
                </div>
                {postDetails}
            </div>
        );
    }
});
var Post=React.createClass({
render:function(){
var postDetails;
if(this.props.userSignedIn){
postDetails=
{this.props.postOptions}
{this.props.voces}
}
返回(
{this.props.post.content}
{postDetails}
);
}
});