一: 基本概念说明:
- Store ( 就是保存数据的地方,你可以把它看成一个容器。整个应用只能有一个 Store。)
- State ( Store对象包含所有数据。如果想得到某个时点的数据,就要对 Store 生成快照。这种时点的数据集合,就叫做 State。
当前时刻的state,可以通过store.getState()拿到。) - Action ( State 的变化,会导致 View 的变化。Action 就是 View 发出的通知,表示 State 应该要发生变化了。)
- store.dispatch()是 View 发出 Action 的唯一方法。
- Store 收到 Action 以后,必须给出一个新的 State,这样 View 才会发生变化。这种 State 的计算过程就叫做 Reducer。
Reducer 是一个函数,它接受 Action 和当前 State 作为参数,返回一个新的 State。 - Store 允许使用store.subscribe方法设置监听函数,一旦 State 发生变化,就自动执行这个函数,这时候就可以触发重新渲染view。
- 关于redux的异步操作:
class AsyncApp extends Component {
componentDidMount() {
const { dispatch,selectedPost } = this.props
dispatch(fetchPosts(selectedPost))
}
const fetchPosts = postTitle => (dispatch,getState) => {
dispatch(requestPosts(postTitle));
return fetch(`/some/API/${postTitle}.json`)
.then(response => response.json())
.then(json => dispatch(receivePosts(postTitle,json)));
};
};
- connect 用于从ui组件生成容器组件。
import { connect } from 'react-redux'
const VisibletodoList = connect(
mapStatetoProps,//输入逻辑,即将state映射到ui组件的参数(props),每当state更新的时候,就会自动执行,重新计算ui组件的参数,从而触发ui组件的重新渲染;
mapdispatchToProps //输出逻辑,用来建立ui组件的参数到store.dispatch方法的映射;
)(TodoList)
二:工作流程
好文推荐:
原文地址:https://www.jb51.cc/react/304374.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。