0

私が反応を試みたのは初めてです。そして、私は何が起こっているのか理解していません.. :)

持っている:

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)
    )
4

2 に答える 2

1

の子要素の配列を単純に返すことができますLikeBox

@LikeBox = React.createClass
  render: ->
    React.DOM.div
    className: 'like-box'
    [
      React.createElement(Dislike, @props)   
      React.createElement(Like, @props)
    ]
于 2016-01-18T09:32:50.737 に答える