我是 React.js 的新手。我正在尝试绑定数据数组。我正在寻找 ng-repeat 的等效项,但我在文档中找不到它。
e.g:
var data = ['red', 'green', 'blue']
使用角度我会在我的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', 'green', 'blue'];
React.render(<List data={ data } />, document.body);
Here http://jsfiddle.net/wiredprairie/kdcfx3sj/它正在使用中。
而且,正如您所看到的,您可以快速构建一个可以“重复”列表的可重用组件。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)