How to loop and render elements in React.js without an array of objects to map?

Question

I\'m trying to convert a jQuery component to React.js and one of the things I\'m having difficulty with is rendering n number of elements based on a for loop.

I un

Answer 1

Here is more functional example with some ES6 features:

'use strict';

const React = require('react');

function renderArticles(articles) {
    if (articles.length > 0) {      
        return articles.map((article, index) => (
            

        ));
    }
    else return [];
}

const Article = ({article}) => {
    return ( 
        

            {article.title}
            
{article.description}
        
    );
};

const Articles = React.createClass({
    render() {
        const articles = renderArticles(this.props.articles);

        return (
            

                { articles }
            
        );
    }
});

module.exports = Articles;