gpt4 book ai didi

javascript - 在路线更改时 react 通量重置存储值

转载 作者:行者123 更新时间:2023-11-29 19:27:33 26 4
gpt4 key购买 nike

我有简单的 React 和 Flux 实现。我正在创建包含操作和商店的新帖子,但问题是如果用户转到另一条路线并返回 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>
);
}
});

如何在转到其他 View 时重置状态?

最佳答案

您可以使用 recycle为您执行此操作的方法 -

如果您希望将特定或所有商店的状态重置回其原始初始状态,您可以调用回收。 Recycle 需要一些你想重置的商店。如果未提供参数,则重置所有存储。

 componentWillUnmount() {
NewPostStore.unlisten(this.onChange);
alt.recycle(NewPostStore);
}

关于javascript - 在路线更改时 react 通量重置存储值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29989926/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com