var TodoActions = Reflux.createActions([ 'contentItem']);var TodoStore = Reflux.createStore({ items:[], listenables:[TodoActions], onGetAll:function(){ this.trigger(this.items); }, onContentItem:function(name,t2,time){ this.items.push({"user":name,"content":t2,"date":time}); this.trigger(this.items); }});var MessItem = React.createClass({ render:function(){ var item = this.props.data; return( <p>{item.user}--{item.content}--{item.date}</p> ) }});var CommentList = React.createClass({ mixins:[Reflux.connect(TodoStore,"list")], getInitialState:function(){ return{list: []}; }, componentDidMount: function () {? ? ? ?TodoActions.getAll();? ? }, clickHandler:function(e){ e.preventDefault(); var author = this.refs.author.getDOMNode().value.trim();? ? ? ? var content = this.refs.content.getDOMNode().value.trim();? ? ? ? var date = new Date().toLocaleTimeString();// ? ? ?if(!author || !content) return;// ? ? ?this.refs.author.getDOMNode().value='';// ? ? ?this.refs.content.getDOMNode().value='';// ? ? ?TodoActions.contentItem(author,content,date); TodoStore.onContentItem(author,content,date); }, render:function(){ return( <div> <h1>React評(píng)論</h1> <div> {this.state.list.map(function(item){ return <MessItem data={item}/> })} </div> <div> <input ref="author" placeholder="你你你"/> <br/><br/> <textarea ref="content" ?row="7" placeholder="木子 I miss you "></textarea> <br/><br/> <button onClick={this.clickHandler} className="cursor">提交</button> </div> </div> ) }});ReactDOM.render(<CommentList />,document.getElementById('container'));