{"id":19916916,"url":"https://github.com/rubylouvre/mmdux","last_synced_at":"2025-05-03T06:30:40.755Z","repository":{"id":57299214,"uuid":"63670731","full_name":"RubyLouvre/mmDux","owner":"RubyLouvre","description":"avalon的redux","archived":false,"fork":false,"pushed_at":"2016-07-22T02:28:21.000Z","size":142,"stargazers_count":10,"open_issues_count":2,"forks_count":5,"subscribers_count":1,"default_branch":"master","last_synced_at":"2025-04-19T06:46:57.709Z","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":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/RubyLouvre.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2016-07-19T07:18:12.000Z","updated_at":"2018-03-14T01:45:28.000Z","dependencies_parsed_at":"2022-08-26T18:02:32.325Z","dependency_job_id":null,"html_url":"https://github.com/RubyLouvre/mmDux","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RubyLouvre%2FmmDux","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RubyLouvre%2FmmDux/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RubyLouvre%2FmmDux/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/RubyLouvre%2FmmDux/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/RubyLouvre","download_url":"https://codeload.github.com/RubyLouvre/mmDux/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252154732,"owners_count":21702982,"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-11-12T21:47:59.834Z","updated_at":"2025-05-03T06:30:40.461Z","avatar_url":"https://github.com/RubyLouvre.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"mmDux\n=======\n\nmmDux是redux的avalon版本\n\n只是将里面store的observable方法去掉, 里面的辅助函数改成avalon的工具方法\n\nmmDux是一种可预知的状态容器\n\n##Store\n\nstore 是一个单一对象：\n\n   1.  管理应用的 state\n   2.  通过 store.getState() 可以获取 state\n   3.  通过 store.dispatch(action) 来触发 state 更新\n   4.  通过 store.subscribe(listener) 来注册 state 变化监听器\n   5.  通过 createStore(reducer, [initialState]) 创建\n\n```\nvar store = mmDux.createStore(function(){\n    return {}\n})\nconsole.log(store)\n\n```\n![](./doc/store.png)\n\n##ActionCreator\n\naction是一个普通的对象，用来描述应用程序中发生的某件事情，\n它是应用程序中可以用来描述数据变化的唯一角色。\n\nactionCreator 是一个函数，用来创建一个action：\n```javascript\nvar actionCreator = function() {\n    return {\n        type: 'AN_ACTION' //注意type值必须全部大写\n    }\n}\n```\n\n##Reducers\n\nActions用来告诉我们应用程序中有某件事情发生了，但是并不会告诉store这些改变改如何响应，\n也不会改变store。这就是Reducers的工作。\n```javascript\nvar reducer = function () {\n    console.log('Reducer was called with args', arguments)\n}\n\nvar store = createStore(reducer)\n```\n\n这里的reducer也就是根reducer，但我们可以有多个reducer，他们分别只处理一部分的state。\n然后通过combineReducers组成根reducer用来创建一个store, 比如：\n```javascript\nvar userReducer = function (state = {}, action) {\n        // etc.\n}\nvar itemsReducer = function (state = [], action) {\n        // etc.\n}\nvar reducer = combineReducers({\n    user: userReducer,\n    items: itemsReducer\n})\n```\n\nmmDux 的核心思想之一就是，它不直接修改整个应用的状态树，\n而是将状态树的每一部分进行拷贝并修改拷贝后的部分，然后将这些部分重新组合成一颗新的状态树。\n\n也就是说，子 reducers 会把他们创建的副本传回给根 reducer，\n而根 reducer 会把这些副本组合起来形成一颗新的状态树。最后根 reducer 将新的状态树传回给 store，\nstore 再将新的状态树设为最终的状态。\n\nMiddleware\nmiddleware 其实就是高阶函数，作用于 dispatch 返回一个新的 dispatch（附加了该中间件功能）。\n可以形式化为：newDispatch = middleware1(middleware2(...(dispatch)...))。\n\n```\n//redux-thunk\nfunction createThunkMiddleware(extraArgument) {\n  return function({ dispatch, getState }) {\n        return function(next){\n            return function(action){\n                if (typeof action === 'function') {\n                  return action(dispatch, getState, extraArgument);\n                }\n\n                return next(action);\n            }\n        }\n     } \n\n  };\n}\n\nvar thunk = createThunkMiddleware();\nthunk.withExtraArgument = createThunkMiddleware;\n\nmodule.exports = thunk\n\n```\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frubylouvre%2Fmmdux","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frubylouvre%2Fmmdux","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frubylouvre%2Fmmdux/lists"}