loop adding component in reactjs

Question

How to add component card in loop? How to do it in right way? All snipet here https://jsfiddle.net/oL1gawfo/

    ...
        for(let i=1;i<5,i++){
          var colorhex="#FFA"+i+"56";
          ReactDOM.render(
            <div>
              <Card color=colorhex/>
            </div>,
            document.querySelector("#c"+i)
          );
        }
  ...

Shubham Khatri · Accepted Answer · 2017-02-03 06:18:36Z

1

The syntax of your for loop is incorrect. You need ; to separate your for loop expressions and not a comma

for(let i=1;i<5;i++){

      var colorhex="#FFA"+i+"56";
      console.log(colorhex);
      ReactDOM.render(
        <div>
          <Card color={colorhex}/>
        </div>,
        document.querySelector("#c"+i)
      );
    }

JSFIDDLE

answered Feb 3, 2017 at 6:18

Shubham Khatri

284k58 gold badges431 silver badges411 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Sultan Zhumatayev · Accepted Answer · 2017-02-07 08:56:41Z

0

i just found another way.

var colors = ["#393E41", "#E94F37", "#1C89BF", "#A1D363",
              "#85FFC7", "#297373", "#FF8552", "#A40E4C"];

var renderData = [];

for (var i = 0; i < colors.length; i++) {
  renderData.push(<Circle bgColor={colors[i]}/>);
}

ReactDOM.render(
  <div>
    {renderData}
  </div>,
  destination
);

answered Feb 7, 2017 at 8:56

Sultan Zhumatayev

5631 gold badge9 silver badges23 bronze badges

Collectives™ on Stack Overflow

loop adding component in reactjs

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related