这节要讲的如何给组件动态加入数据.如下，我们希望在使用Comment依赖的时候让其内容包含自己的属性author
react这样的做法就是实现组件的语义话，让组件更加规范
// tutorial4.js
var CommentList = React.createClass(
{ render: function() { return ( <div className="commentList"> <Comment author="Pete Hunt">This is one comment</Comment> <Comment author="Jordan Walke">This is *another* comment</Comment> </div> ); }
});
所以在子组件内部需要更改为：
// tutorial5.js
var Comment = React.createClass(
{ render: function() { return ( <div className="comment"> <h2 className="commentAuthor">
{this.props.author} </h2> {this.props.children} </div> );
}
});
这样，当父组件调用子组件的时候给其赋予了属性author和内容This is one comment，子组件就可以拿到这个author的属性，至于内容统一作为children，这里就跟xml里面的
子节点一样
markdown可以用来格式化文本内容，比如加入强调标签等.
首先，导入markdown的依赖库：
<script src="http://cdnjs.cloudflare.com/ajax/libs/showdown/0.3.1/showdown.min.js"></script>
接下来在React组件中引入
var converter = new Showdown.converter();
var Comment = React.createClass({
render: function() {
var rawMarkup = converter.makeHtml(this.props.children.toString());
return (
<div className="comment">
<h2 className="commentAuthor">
{this.props.author}
</h2>
<span dangerouslySetInnerHTML={{__html: rawMarkup}} />
</div>
);
}
});
把属性转化后想让React按照html渲染，必须得加上dangerouslySetInnerHTML,否则因为React会放置Xss攻击而导致按照文本显示