Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/y4roc/vuex-mapping
Mapping references between models
https://github.com/y4roc/vuex-mapping
Last synced: about 12 hours ago
JSON representation
Mapping references between models
- Host: GitHub
- URL: https://github.com/y4roc/vuex-mapping
- Owner: y4roc
- License: mit
- Created: 2019-10-16T11:24:20.000Z (about 5 years ago)
- Default Branch: master
- Last Pushed: 2022-12-04T16:16:05.000Z (almost 2 years ago)
- Last Synced: 2024-04-26T02:02:32.597Z (7 months ago)
- Language: JavaScript
- Homepage:
- Size: 188 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 7
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# Vuex Mapping
Vuex-Mapping is an easy way to map references between two and more objects.
## Installation
```shell script
npm install vuex-mapping
yarn add vuex-mapping
```
## Using
```ecmascript 6
import Vue from 'vue'
import Vuex from 'vuex'
import mapping from 'vuex-mapping'
Vue.use(Vuex)
const store = new Vuex.Store({
plugins: [mapping],
...
})
new Vue({
store,
...
})
```
## Working with it
Vuex-Mapping is listing on each mutation and action. It get the payload and looks for objects with property `id` and `__typename`. In `__typename` should be the type of the model.
## Example
```ecmascript 6
// create an user
commit('saveUser', {
id: 1,
username: 'Bob',
group: {
id: 1,
__typename: 'Group'
},
__typename: 'User'
})
// create a group
commit('saveGroup', {
id: 1,
name: 'Admin',
__typename: 'Group'
})
// update a group
commit('saveGroup', {
id: 1,
description: 'Sleeping all time',
__typename: 'Group'
})
// create a second user
commit('saveUser', {
id: 2,
username: 'Ann',
group: {
id: 1,
__typename: 'Group'
},
__typename: 'User'
})
// Get saved users
let bob = action('loadUserById', 1)
let ann = action('loadUserById', 2)
/* Output should be:
* {id: 1, username: 'Bob', group: {id: 1, name: 'Admin', description: 'Sleeping all time', __typename: 'Group'}}
* {id: 2, username: 'Ann', group: {id: 1, name: 'Admin', description: 'Sleeping all time', __typename: 'Group'}}
*/
console.log(bob)
console.log(ann)
```