我有简单的反应和通量实现。我正在创建包含动作和商店的新帖子,但问题是如果用户转到另一条路线并返回 this.postAdded 仍然是相同的值。
商店:
class NewPostsStore {
constructor() {
this.title = '';
this.body = '';
this.postAdded = false;
this.bindListeners({
createPost: PostsActions.createPost
});
}
createPost(res) {
this.postAdded = res.add;
}
}
行动:
class PostsActions {
getPosts() {
$.ajax({
url: url
}).then((posts) => {
this.dispatch(posts);
});
}
createPost(post) {
$.ajax({
type:'POST',
data: post,
url: url
}).then((res) => {
this.dispatch(res);
});
}
}
module.exports = Blog.createActions(PostsActions);
组件:
export default React.createClass({
mixins: [addons.LinkedStateMixin],
getInitialState() {
return NewPostStore.getState();
},
onChange() {
this.setState(NewPostStore.getState());
},
componentDidMount() {
PostsActions.getPosts();
NewPostStore.listen(this.onChange);
},
componentWillUnmount() {
NewPostStore.unlisten(this.onChange);
},
submit(e) {
e.preventDefault();
PostsActions.createPost({
title: this.state.title,
body: this.state.body
});
},
setMessage() {
if(this.state.postAdded) {
return <h5>success</h5>
} else {
return <h5>failed</h5>
}
},
render() {
return (
<div>
<form onSubmit={this.submit}>
<input type="text" placeholder="Enter Title" valueLink={this.linkState('title')} />
<input type="text" placeholder="Enter Body" valueLink={this.linkState('body')}/>
<button>Create</button>
</form>
{this.setMessage()}
</div>
);
}
});
如何在转到其他视图时重置状态?