Question

这是我第一次尝试使用反应时。我不明白发生了什么.. :)

A有：

Dislike = React.createClass
  render: ->
    if @props.auth == true
      React.DOM.a
        className: ''
        React.DOM.i
          className: 'fa fa-thumbs-o-down'
          "Dislike (#{@props.num_dislike})"
    else
      React.DOM.i
        className: 'fa fa-thumbs-o-down'
        "Dislike (#{@props.num_dislike})"

Like = React.createClass
  render: ->
    if @props.auth == true
      React.DOM.a
        className: ''
        React.DOM.i className: 'fa fa-thumbs-o-up',
          "Like (#{@props.num_like})"
    else
      React.DOM.i
        className: 'fa fa-thumbs-o-up'
        "Like (#{@props.num_like})"

@LikeBox = React.createClass
  render: ->
    return (
      React.createElement(Dislike, @props)
      React.createElement(Like, @props)
    )

在我看来，有一个：

= react_component('LikeBox', {auth: current_user.present?,
                                  num_like: 23,
                                  num_dislike: 32,
                                  link_like: like_suggestion_path(suggestion),
                                  link_dislike: dislike_suggestion_path(suggestion)})

当我打开页面时，有一个：

<div data-react-class="LikeBox" data-react-props="{....}">
  <a class="" data-reactid=".0">
    <i class="fa fa-thumbs-o-up" data-reactid=".0.0">Like (23)</i>
  </a>
</div>

但我的期望是：

<div data-react-class="LikeBox" data-react-props="{....}">
  <a class="" data-reactid=".0">
    <i class="fa fa-thumbs-o-up" data-reactid=".0.0">Like (23)</i>
  </a>
  <a class="" data-reactid=".0">
    <i class="fa fa-thumbs-o-down" data-reactid=".0.0">Dislike (73)</i>
  </a>
</div>

这个街区出了什么问题？

@LikeBox = React.createClass
  render: ->
    return (
      React.createElement(Dislike, @props)
      React.createElement(Like, @props)
    )

Answer 1

我们可以简单地返回LikeBox

的子元素数组

@LikeBox = React.createClass
  render: ->
    React.DOM.div
    className: 'like-box'
    [
      React.createElement(Dislike, @props)   
      React.createElement(Like, @props)
    ]

Answer 2

只有'Like'元素将在LikeBox中呈现。为了使它工作，你可以这样做：

@LikeBox = React.createClass
  render: ->
   React.DOM.div
    className: 'like-box'
    React.createElement(Dislike, @props)   
    React.createElement(Like, @props)

在上面的代码中，将呈现一个div，其中包含2个子元素

gem react-rails，我的咖啡风格出了什么问题？

2 个答案: