{"id":15882740,"url":"https://github.com/fedomn/react-redux-starter-kit","last_synced_at":"2025-07-21T09:05:09.089Z","repository":{"id":87646538,"uuid":"63133570","full_name":"Fedomn/react-redux-starter-kit","owner":"Fedomn","description":null,"archived":false,"fork":false,"pushed_at":"2017-04-26T10:05:14.000Z","size":10,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-02T05:47:37.791Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/Fedomn.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2016-07-12T06:45:55.000Z","updated_at":"2016-07-15T08:06:59.000Z","dependencies_parsed_at":null,"dependency_job_id":"4c39908d-a2da-4608-a171-304805d76208","html_url":"https://github.com/Fedomn/react-redux-starter-kit","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/Fedomn/react-redux-starter-kit","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Fedomn%2Freact-redux-starter-kit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Fedomn%2Freact-redux-starter-kit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Fedomn%2Freact-redux-starter-kit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Fedomn%2Freact-redux-starter-kit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/Fedomn","download_url":"https://codeload.github.com/Fedomn/react-redux-starter-kit/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/Fedomn%2Freact-redux-starter-kit/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":266270448,"owners_count":23902734,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2024-10-06T04:06:56.806Z","updated_at":"2025-07-21T09:05:09.081Z","avatar_url":"https://github.com/Fedomn.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# redux基础流程\n* 1 关联: 在configStore里, 把所有的reducer和store先关联起来\n* 2 分发action: 创建的store 通过dispatch一个action, 分发到各个reducers里\n* 3 更新state: reducers根据action.type 来更新对应state, 确保store数据是最新的\n* 4 更新view: react-redux提供的connect方法, 将原始根节点包装在connect下,\n并将state对象中的props和store中的dispatch函数传递给原始根节点props, 从而改变全局view\n\n# 主要部分介绍\n\n## Redux主要分三个部分: Action Reducer Store\n\n### Action\naction主要用来传递操作state的信息, 一般是以Js Plain Object的形式存在\n实际上, 我们都是通过创建函数来生产action, 这类函数统称为Action Creator\n```javascript\nfunction addTodo(text) {\n  return { type: types.ADD_TODO, text };\n}\n```\n\n### Reducer\nreducer为state的处理函数, 通过传入旧的state和action来更新state\n\n### Store\nStore是单一的, 维护着一个全局的state, 并根据action来进行事件分发处理state\n所以看出, Store是一个把Action和Reducer结合起来的对象\n而store.dispatch(action)用于将action对象发送给reducer处理, 减少对reducer的直接调用, 并且能够更好的管理state\n\n### bindActionCreators\n我们通过ActionCreator来生产action, 所以实际调用为 store.dispatch(actionCreator(...args))\n而bindActionCreators就是将store.dispatch 和 ActionCreator进行再一次封装, 转换成一个参数(actions),\n在组件里通过调用actions里的方法,就相当于dispatch了一个action, 进而分发到reducers里\n\n## React-Redux\nredux并不依赖于react, 它是一个javascript状态容器, 提供可预测化的状态管理.\n而react和redux结合, 就是要在更新state后, 会触发重新render函数, 进行更新组件.\n\n### connect\n它主要为react-components提供 Store里的state数据和dispatch方法. 这样组件可以通过dispatch来更新state.\n最后connect把state和dispatch通过props的方式 传递给组件.\n\n### Provider\nconnect组件需要Store, 所以redux提供了Provider来注入Store,\n使其子组件能够在[context](https://facebook.github.io/react/docs/context.html)中得到store对象.\n\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffedomn%2Freact-redux-starter-kit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Ffedomn%2Freact-redux-starter-kit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Ffedomn%2Freact-redux-starter-kit/lists"}