angularjs – ng-repeat的等效反应

我是React.js的新手。我试图绑定数据数组。我正在寻找相当于ng-repeat，但我不能在文档中找到它。

例如：

var data =  ['red','green','blue']

使用angular我会在我的html做这样的事情：

<div ng-repeat="i in data">{{i}}</div>

我想知道React的标记做这个

在React中，您只需编写必要的JavaScript(可能将其构建为可重用的控件，如您所见)。这是非常规范和容易做，一旦你学习基本模式(以及它们如何不同于AngularJS)。

因此，在render函数中，您需要遍历列表。在下面的例子中，我使用了map，但是你可以根据需要使用其他迭代器。

var List = React.createClass({
    render: function() {
        return (<div>
        { this.props.data.map(function(item) {
                return <div>{item}</div>
            })
        }
        </div>);
    }
});

var data =  ['red','blue'];

React.render(<List data={ data }  />,document.body);

Here它正在使用中。

而且，你可以看到，你可以快速构建一个可重复使用的组件，可以“重复”通过列表。