reflux+react web 第二种写法

来源：互联网发布：知乎怎么收藏文章编辑：程序博客网时间：2024/06/05 17:34

//组件监听store第二种写法  Mixins//使用了组件的mixins属性，省去了销毁时的取消监听函数var TodoComponent=React.createClass({mixins:[Reflux.listenerMixin],getInitialState:function(){return {list:[],text:''}},onStatusChange:function(list){this.setState({list:list})},componentDidMount:function(){this.unsubscribe = TodoStore.listen(this.onStatusChange);        TodoActions.getAll({pid1:123,pid2:141});},onChangeText:function(ev){//this.setState({text:ev.target.value});//最新的refs获取标签不需要getDOMNode()了this.setState({text:this.refs.reftext.value})},onAddItem:function(){var data={userName:this.state.text};TodoActions.addItem(data);this.setState({text:''})},render:function(){return ( <div>                {this.state.list.map(function (item,index) {                    return <p key={index}>{item.userName}</p>                })}                <input type="text" value={this.state.text} onChange={this.onChangeText}  ref="reftext" />                <button onClick={this.onAddItem}>添加</button>            </div>);}})

组件内使用mixins:[Reflux.listenerMixin]。

这样可以不用写销毁方法

0 0