short div tag from html why loop in react

user_3676603 0
Viewed 39

I am new to react JS platform. but decided to try to hands-on that I have stuck at one simple thing.

<div>
    <a href="#"><img src="test.png"></a>
</div>
<div>
    <a href="#"><img src="test.png"></a>
</div>
<div>
    <a href="#"><img src="test.png"></a>
</div>
<div>
    <a href="#"><img src="test.png"></a>
</div>
<div>
    <a href="#"><img src="test.png"></a>
</div>
<div>
    <a href="#"><img src="test.png"></a>
</div>
<div>
    <a href="#"><img src="test.png"></a>
</div>
<div>
    <a href="#"><img src="test.png"></a>
</div>
<div>
    <a href="#"><img src="test.png"></a>
</div>
<div>
    <a href="#"><img src="test.png"></a>
</div>
<div>
    <a href="#"><img src="test.png"></a>
</div>

I have set this HTML get from my database, now I need to make a loop so I can convert this string to an array structure for every div. anyone has an idea how can I able to do that. below is my code not working properly.

$(sliderContent).each(function() {
                    tempArray.push(
                        <div className={classes.slides}>
                            {this}
                        </div>
                    );
                });
reactjs jquery
2 Answers

I think you store wrong values in your DB, you just need to keep vaues in your DB not div tags, just store string values in your Array/Object and you can run each loop to display in DOM, for learning React you need to learn by it's approach do not compare React with jquery, it will raise your confusion.

DBData =['val1','val2','val3']

react code

DBData.each((_e,_i)=>{
 return <div key={_i}> _e </div>
})

react is not similar as jquery.

user_31138990

Used simple logic, take a reference of the above div, and use each loop. It's not proper solution but works fine

let tempArray = [];
    
$('.homepage-brand-slider div').each(function() {
     tempArray.push(this);
});
user_36766030
Related