{"id":13511372,"url":"https://github.com/ejfrancis/Vuex-Alt","last_synced_at":"2025-03-30T20:33:04.219Z","repository":{"id":79517329,"uuid":"93008619","full_name":"ejfrancis/Vuex-Alt","owner":"ejfrancis","description":"An alternative approach to Vuex helpers for accessing state, getters and actions that doesn't rely on string constants.","archived":false,"fork":false,"pushed_at":"2018-11-14T03:50:26.000Z","size":73,"stargazers_count":14,"open_issues_count":1,"forks_count":2,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-03-21T19:04:07.710Z","etag":null,"topics":["flux","flux-architecture","state-management","vue","vuex"],"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/ejfrancis.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,"governance":null,"roadmap":null,"authors":null}},"created_at":"2017-06-01T02:34:47.000Z","updated_at":"2024-01-22T15:17:32.000Z","dependencies_parsed_at":"2023-05-14T04:15:10.282Z","dependency_job_id":null,"html_url":"https://github.com/ejfrancis/Vuex-Alt","commit_stats":{"total_commits":25,"total_committers":1,"mean_commits":25.0,"dds":0.0,"last_synced_commit":"7898097ab1fda51f1b3442b47d98d6f8336347b3"},"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ejfrancis%2FVuex-Alt","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ejfrancis%2FVuex-Alt/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ejfrancis%2FVuex-Alt/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/ejfrancis%2FVuex-Alt/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/ejfrancis","download_url":"https://codeload.github.com/ejfrancis/Vuex-Alt/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":246379367,"owners_count":20767694,"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":["flux","flux-architecture","state-management","vue","vuex"],"created_at":"2024-08-01T03:00:48.570Z","updated_at":"2025-03-30T20:33:03.951Z","avatar_url":"https://github.com/ejfrancis.png","language":"JavaScript","funding_links":[],"categories":["vue"],"sub_categories":[],"readme":"# Vuex-Alt\nAn alternative, opinionated approach to Vuex helpers for accessing state, getters and actions that doesn't rely on string constants.\n\n## Installation\n\nFirst install the npm package with \n\n```npm install --save vuex-alt```\n\nThen use the plugin, passing in the Vuex Store.\n\n```javascript\nimport Vuex from 'vuex';\nimport { VuexAltPlugin } from 'vuex-alt';\n\n// use Vuex as usual\nVue.use(Vuex);\n\n// create your store\nconst store = new Vuex.Store({ ... });\n\n// use the VuexAltPlugin, and pass it\n// the new Vuex Store\nVue.use(VuexAltPlugin, { store });\n```\n\n## Prerequisites\nVuex-Alt makes two intentional, opinionated assumptions about your Vuex code:\n\n1. Mutations are only commited from within actions. Components never directly commit mutations. Every mutation has an accompanying action.\n2. All Vuex state, getters and actions are organized into [Vuex modules](https://vuex.vuejs.org/en/modules.html).\n\nThese two rules lead to more scalable state management code, and more predictable state changes.\n\n## API Usage \nVuex-Alt provides an alternative approach to the Vuex helpers for `mapState`, `mapActions`, and `mapGetters`. \n\nThe main difference between the Vuex-Alt helpers and the original Vuex helpers is that instead of accepting strings to specify the namespace and action/getter you want, access is done via functions and nested objects.\n\n### mapState()\nProvide an object that maps local Vuex instance properties to Vuex module properties.\n\nFor example, if you have a state property called `count` on a Vuex store module called `counter` you would access it like this:\n\n```javascript\ncomputed: {\n  ...mapState({\n    count: (state) =\u003e state.counter.count\n  })\n}\n```\n\n### mapActions()\nProvide an object that maps local Vuex instance methods to Vuex module methods.\n\nFor example, if you have an action called `increment()` on a Vuex store module called `counter` you would access it like this:\n\n```javascript\nmethods: {\n  ...mapActions({\n    increment: (actions) =\u003e actions.counter.increment\n  })\n}\n```\n\nNow you can access it in your component via `this.increment(10)`.\n\n### mapGetters()\nProvide an object that maps local Vuex instance properties to Vuex module getters.\n\nFor example, if you have a getter called `countPlusTen()` on a Vuex store module called `counter` you would access it like this:\n\n```javascript\ncomputed: {\n  ...mapGetters({\n    countPlusTen: (getters) =\u003e getters.counter.countPlusTen\n  })\n}\n```","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fejfrancis%2FVuex-Alt","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fejfrancis%2FVuex-Alt","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fejfrancis%2FVuex-Alt/lists"}