javascript - How to append element to variable to be render in react - Stack Overflow

admin管理员组

文章数量:1208153

Given a react component like below (/):

var Hello = React.createClass({
  render: function() {
    let { cond, name } = this.props;
    let content, content2;
    if (cond){
      content = (<div>Hello { name } </div>);
      content2 = (<div>content 2</div>);
    }

    return (
      <div>
        { content }
        { content2 }
      </div>
    )
  }
});

ReactDOM.render(
  <Hello name="World" cond={ true } />,
  document.getElementById('container')
);

How can I achieve something like:

content += (<div>content 2</div>) //not working

and then render the content in a single content variable instead of both content and content 2?

Given a react component like below (https://jsfiddle.net/69z2wepo/28684/):

var Hello = React.createClass({
  render: function() {
    let { cond, name } = this.props;
    let content, content2;
    if (cond){
      content = (<div>Hello { name } </div>);
      content2 = (<div>content 2</div>);
    }

    return (
      <div>
        { content }
        { content2 }
      </div>
    )
  }
});

ReactDOM.render(
  <Hello name="World" cond={ true } />,
  document.getElementById('container')
);

How can I achieve something like:

content += (<div>content 2</div>) //not working

and then render the content in a single content variable instead of both content and content 2?

• javascript
• reactjs

Share Improve this question Follow asked Jan 24, 2016 at 13:06 mysticmystic 14511 gold badge11 silver badge55 bronze badges

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 20

var Hello = React.createClass({
  render: function() {
    let { cond, name } = this.props;
    let content, content2, contents;
    if (cond){
        content = (<div>Hello { name } </div>);
      content2 = (<div>content 2</div>);
      contents = [content, content2];
    }

    return (
        <div>
        { contents }
      </div>
    )
  }
});

ReactDOM.render(
  <Hello name="World" cond={ true } />,
  document.getElementById('container')
);

https://jsfiddle.net/69z2wepo/28687/

本文标签： javascriptHow to append element to variable to be render in reactStack Overflow