Redux bindings for VueJS inspired by Vuex.

Overview

redux-vuex

Redux bindings for VueJS inspired by Vuex.

πŸ‘‰ For the old Vue 2 version check out the legacy branch πŸ‘ˆ

First things first

Why don't you use vuex instead?

Redux and vuex are really hard to compare. Vuex is a state management pattern that clearly defines each subject of the state lifecycle. For most of the projects this helps a lot structuring your application but it also leaves a large architectural footprint.

Redux on the other hand is very adaptable to different scenarios giving you the ability to customize everything around state management like handling side effects (see redux-effects, redux-saga or redux-thunk) or even adapting full application flows like rematch.

Yay, yet another redux lib for VueJS

Valid point, it seems the needs for integrating with redux is strong. So depending on your requirements you may want to use:

  • vuejs-redux if you want provider bindings like react-redux
  • vdeux if you want a different kind of component bindings
  • revue also for nice store bindings but unfortunately its dead :(

Installation

redux-vuex is written in pure es6 and only has dependencies to the beautiful crafted packages get-value and set-value

Get the Package

npm i [email protected] // yarn add redux-vuex

Connect it to your Vue application

import { createApp } from 'vue'
import { provideStore } from 'redux-vuex'

import App from './App.vue'
import { store, actions } from './store'

const app = createApp(App)

provideStore({
  app,
  store,
  actions
})

app.mount('#app')

Usage

redux-vuex is focused on simplifying the access to the redux state and bind state changes to the vue instance in an efficient way.

mapState

To assign state with ease to your component mapState needs to be used. It has two different signatures, depending on your component needs:

Automatic

If you want a 1:1 relationship between your redux store's state property names and your vue component's data then pass the names of these properties from redux as string arguments to mapState:

import { mapState } from 'redux-vuex'

export default {
  name: 'My Vue Component',
  setup() {
    return mapState('users', 'todos') // maps state.users and state.todos to data.users and data.todos
  }
}

Custom property names

Alternatively, if you provide an object to mapState you can specify data property names.

import { mapState } from 'redux-vuex'

export default {
  name: 'My Vue Component',
  setup() {
    return mapState({
      users: 'users', // maps state.users to data.users
      todoList: 'todos' // maps state.todos to data.todoList
    })
  }
}

Single property

You can pass a function that has access to the state object if you want to

import { mapState } from 'redux-vuex'

export default {
  name: 'My Vue Component',
  setup() {
    return mapState({
      state: (state) => ({ todoList: state.todos, users: state.users }) // maps state.todos to data.state.todoList and state.users to data.state.users
    })
  }
}

You can use the last two methods together like so

import { mapState } from 'redux-vuex'

export default {
  name: 'My Vue Component',
  setup() {
    return mapState({
      users: 'users', // maps state.users to data.users
      todoList: (state) => state.todos // maps state.todos to data.todoList
    })
  }
}

Note: using the object notation gives you the ability to use store selectors.

mapActions

For a more convenient action dispatching mapActions can be used. To use this helper you need to pass in the actions in the connect function (see above):

const actions = {
  foo: payload => {
    type: 'FOO', payload
  },

  bar: () => {
    type: 'BAR', payload: { bar: 'baz' }
  }
}
import { mapActions } from 'redux-vuex'

export default {
  name: 'My Vue component',
  setup() {
    return mapActions('foo', 'bar') // creates scoped functions for foo and bar action
  }
  mounted() {
    this.foo('baz') // will dispatch { type: 'FOO', payload: 'baz' }
  }
}

If you need to dispatch multiple actions in one method (or want to assign different names), use the object notation:

import { mapActions } from 'redux-vuex'

export default {
  name: 'My Vue component',
  setup() {
     return mapActions({
        baz: ({ dispatch, actions }, arg1, arg2) => {
          dispatch(actions.foo(arg2))
          dispatch(actions.bar())
        }
     })
  }
  mounted() {
    this.baz('foo', 'bar') // will dispatch foo and bar actions
  }
}

store

Finally, if you need direct access to the store, each component has a binding to the store assigned:

import { inject } from 'vue'
import { injectStore, injectActions } from 'redux-vuex'

export default {
  name: 'My Vue component',
  setup() {
    const store = injectStore()
    const actions = injectActions()

    store.subscribe(() => {
      console.log(store.getState())
    })

    store.dispatch({
      type: 'foo',
      payload: 'bar'
    })
  }
}

Caveats

If you return more than the mapState from the setup make sure to bind the result to a dedicated property. Otherwise the Vue proxies won't work πŸ˜‘

import { mapState } from 'redux-vuex'

export default {
  name: 'My Vue Component',
  setup() {
    return {
      state: mapState({
        users: 'users', // maps state.users to data.users
        todoList: (state) => state.todos // maps state.todos to data.todoList
      }),
      ...mapActions('foo', 'bar')
    }
  }
}

How it works

  • provideStore provides the redux store for composable components
  • mapState creates a reference binding form the redux store
  • Each Vue Component with bindings creates a store subscription
  • On each state change all bindings are evaluated and update
  • Only the mapped properties are retrieved from store and setted

License

MIT

Comments
  • Vue3 Options API Support

    Vue3 Options API Support

    We are upgrading our Project to Vue3, but we are continuing to use Options API. When trying to upgrade this library, we couldn't get it working as this seems to be have re-written exclusively for Composition API. Was this intentional? If so, are there any plans to provide support for Options API as well?

    opened by haritha2112 11
  • Attribute store conflicts with other frame attributes

    Attribute store conflicts with other frame attributes

    Hi, The store is a very common attribute that I have been using with other frameworks.

    I'm trying to rename the store property and send a new one package

    opened by Sayid1 9
  • pre-bound this.mapState bug

    pre-bound this.mapState bug

    Firstly, thanks for open-sourcing this library! Saved me a lot of headache!

    There seems to be a small bug when trying to map an object with the pre-bound this.mapState function as shown in the README example:

    export default {
      name: 'My Vue Component',
      data () {
        return {
          baz: 10
          ...this.mapState({
            baz: function (state) {
              return state.bar + this.baz //maps state.bar + 10 to data.baz
            }
          })
        }
      }
    }
    

    Namely, Vue complains that the value has not been defined and looking at the devtools, I can see that it has mapped an object as the object key:

    screenshot 2018-10-08 at 13 01 23

    At first glance, the rest parameters in mixin.js seems to be the culprit. https://github.com/alexander-heimbuch/redux-vuex/blob/fcedee60856d3944e298feb37e75063b4b608c77/src/mixin.js#L24

    Replacing it with a simple props argument fixes the issue, although I haven't had the chance to look at how it actually affects the mapState function and if it has any side-effects.

    opened by smirzo 5
  • Update component data sync for Vue3 internal channges

    Update component data sync for Vue3 internal channges

    The internals of Vue used to have a property on component instances called _data on it that contained the reactive variables setup by Vue from a component's data() function. The library historically used _data when syncing the store bindings to the components state (bindings typically setup by this.mapState).

    However, in Vue3, all internal properties (fields with leading_) were moved from the root of the component instance to instead be nested under a variable called _. For example: component._data -> component._.data. This change was not immediately noticed when the legacy code was included because the Vue3 compat build still exposes the _data property to help simplify migration. https://github.com/vuejs/vue-next/blob/ad844cf1e767137a713f715779969ffb94207c7a/packages/runtime-core/src/compat/instance.ts#L143

    As such, this change moves the code to using the new internal field. However, it should be noted that this is not actually necessary. Given that the reactivity system in Vue3 has changed to use proxies, we could instead place the bindings directly on the component instead of component._.data.

    Is there are particular reason to continue referencing the internal field over syncing directly to the component? If there is not a reason, then I can update this to stop using the internal ._.data field as it isn't a publicly supported API.

    opened by DV8FromTheWorld 3
  • Usage of mapState with TypeScript in vue

    Usage of mapState with TypeScript in vue

    I am trying to access a state variable using typescript. I am unable to get it to work. This is what I have so far.

    <script type="ts">
    interface Auth {
     accessToken?: string;
     expiresAt?: number;
     authenticated?: boolean;
    }
    import { mapState } from 'redux-vuex';
    import { Vue, Component } from 'vue-property-decorator';
    export default class Example extends Vue {
      private auth: Auth = mapState({
        auth: 'auth'
      })
    }
    </script>
    

    When I try to access the auth variable using this.auth, I am being returned a function instead of the contents of the state object 'auth'. What is the right way of accessing this state variable if using typescript?

    enhancement 
    opened by arunrreddy 3
  • update(beforeDestroy): Update beforeDestroy hook to be beforeUnmount

    update(beforeDestroy): Update beforeDestroy hook to be beforeUnmount

    Issue:

    The lifecycle hook beforeDestroy which is being used in src/legacy/mixin.ts is no longer supported in Vue 3.

    Fix

    Updated beforeDestroy to be beforeUnmount so that it is Vue3 compatible

    Closes #28

    opened by haritha2112 2
  • Declaration files missing in v0.3.2 release

    Declaration files missing in v0.3.2 release

    Hi alex~

    I just tried the [email protected] and it feels like those declation files are missing

    npm pack redux-vuex
    npm notice 
    npm notice πŸ“¦  [email protected]
    npm notice === Tarball Contents === 
    npm notice 463B   .editorconfig      
    npm notice 7.5kB  dist/index.js      
    npm notice 150B   src/index.js       
    npm notice 1.2kB  src/map-actions.js 
    npm notice 1.5kB  src/map-state.js   
    npm notice 1.4kB  src/mixin.js       
    npm notice 602B   webpack.config.js  
    npm notice 829B   package.json       
    npm notice 10.6kB dist/index.js.map  
    npm notice 6.7kB  README.md          
    npm notice 84B    .github/FUNDING.yml
    npm notice === Tarball Details === 
    npm notice name:          redux-vuex                              
    npm notice version:       0.3.2                                   
    npm notice filename:      redux-vuex-0.3.2.tgz                    
    npm notice package size:  11.3 kB                                 
    npm notice unpacked size: 31.1 kB                                 
    npm notice shasum:        f5da59fcbd63383588022286bb573d60b48277d7
    npm notice integrity:     sha512-8WR0jZ1ybLF+W[...]vxKBWxhH6WPng==
    npm notice total files:   11                                      
    npm notice 
    
    

    tar -xvf redux-vuex-0.3.2.tgz -C . tree package/

    package/
    β”œβ”€β”€ dist
    β”‚Β Β  β”œβ”€β”€ index.js
    β”‚Β Β  └── index.js.map
    β”œβ”€β”€ package.json
    β”œβ”€β”€ README.md
    β”œβ”€β”€ src
    β”‚Β Β  β”œβ”€β”€ index.js
    β”‚Β Β  β”œβ”€β”€ map-actions.js
    β”‚Β Β  β”œβ”€β”€ map-state.js
    β”‚Β Β  └── mixin.js
    └── webpack.config.js
    
    2 directories, 9 files
    
    

    But I did notice there were declation files generated into the dist folder of your latest code base..

    tree dist/

    dist/
    β”œβ”€β”€ helper.d.ts
    β”œβ”€β”€ index.d.ts
    β”œβ”€β”€ index.js
    β”œβ”€β”€ index.js.map
    β”œβ”€β”€ map-actions.d.ts
    β”œβ”€β”€ map-state.d.ts
    β”œβ”€β”€ provide-store.d.ts
    β”œβ”€β”€ tokens.d.ts
    └── types.d.ts
    

    errr........did we accidently ignore too many while publishing?

    opened by albertleigh 2
  • Return the result of the store.dispatch call to work with async actions like redux-thunk

    Return the result of the store.dispatch call to work with async actions like redux-thunk

    Returning the result of the store.dispatch call allows callers to wait on the result of async actions, like redux-thunks where the result of the thunk is a Promise. (https://github.com/reduxjs/redux-thunk)

    e.g.

    methods: {
        ...mapActions('myAction'),
        doThing() {
            const result = await myAction();
        }
    }
    
    opened by steve-low 2
  • chore(deps): bump parse-url from 6.0.0 to 6.0.5

    chore(deps): bump parse-url from 6.0.0 to 6.0.5

    Bumps parse-url from 6.0.0 to 6.0.5.

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • chore(deps): bump terser from 4.8.0 to 4.8.1

    chore(deps): bump terser from 4.8.0 to 4.8.1

    Bumps terser from 4.8.0 to 4.8.1.

    Changelog

    Sourced from terser's changelog.

    v4.8.1 (backport)

    • Security fix for RegExps that should not be evaluated (regexp DDOS)
    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • chore(deps): bump parse-url from 6.0.0 to 6.0.2

    chore(deps): bump parse-url from 6.0.0 to 6.0.2

    Bumps parse-url from 6.0.0 to 6.0.2.

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 1
  • chore(deps): bump json5 from 2.2.1 to 2.2.3

    chore(deps): bump json5 from 2.2.1 to 2.2.3

    Bumps json5 from 2.2.1 to 2.2.3.

    Release notes

    Sourced from json5's releases.

    v2.2.3

    v2.2.2

    • Fix: Properties with the name __proto__ are added to objects and arrays. (#199) This also fixes a prototype pollution vulnerability reported by Jonathan Gregson! (#295).
    Changelog

    Sourced from json5's changelog.

    v2.2.3 [code, diff]

    v2.2.2 [code, diff]

    • Fix: Properties with the name __proto__ are added to objects and arrays. (#199) This also fixes a prototype pollution vulnerability reported by Jonathan Gregson! (#295).
    Commits
    • c3a7524 2.2.3
    • 94fd06d docs: update CHANGELOG for v2.2.3
    • 3b8cebf docs(security): use GitHub security advisories
    • f0fd9e1 docs: publish a security policy
    • 6a91a05 docs(template): bug -> bug report
    • 14f8cb1 2.2.2
    • 10cc7ca docs: update CHANGELOG for v2.2.2
    • 7774c10 fix: add proto to objects and arrays
    • edde30a Readme: slight tweak to intro
    • 97286f8 Improve example in readme
    • Additional commits viewable in compare view

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
  • chore(deps): bump decode-uri-component from 0.2.0 to 0.2.2

    chore(deps): bump decode-uri-component from 0.2.0 to 0.2.2

    Bumps decode-uri-component from 0.2.0 to 0.2.2.

    Release notes

    Sourced from decode-uri-component's releases.

    v0.2.2

    • Prevent overwriting previously decoded tokens 980e0bf

    https://github.com/SamVerschueren/decode-uri-component/compare/v0.2.1...v0.2.2

    v0.2.1

    • Switch to GitHub workflows 76abc93
    • Fix issue where decode throws - fixes #6 746ca5d
    • Update license (#1) 486d7e2
    • Tidelift tasks a650457
    • Meta tweaks 66e1c28

    https://github.com/SamVerschueren/decode-uri-component/compare/v0.2.0...v0.2.1

    Commits

    Dependabot compatibility score

    Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.


    Dependabot commands and options

    You can trigger Dependabot actions by commenting on this PR:

    • @dependabot rebase will rebase this PR
    • @dependabot recreate will recreate this PR, overwriting any edits that have been made to it
    • @dependabot merge will merge this PR after your CI passes on it
    • @dependabot squash and merge will squash and merge this PR after your CI passes on it
    • @dependabot cancel merge will cancel a previously requested merge and block automerging
    • @dependabot reopen will reopen this PR if it is closed
    • @dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually
    • @dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)
    • @dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)
    • @dependabot use these labels will set the current labels as the default for future PRs for this repo and language
    • @dependabot use these reviewers will set the current reviewers as the default for future PRs for this repo and language
    • @dependabot use these assignees will set the current assignees as the default for future PRs for this repo and language
    • @dependabot use this milestone will set the current milestone as the default for future PRs for this repo and language

    You can disable automated security fix PRs for this repo from the Security Alerts page.

    dependencies 
    opened by dependabot[bot] 0
Releases(3.0.0)
  • 3.0.0(Oct 29, 2022)

  • 3.0.0-beta.7(Dec 12, 2021)

    • Merge pull request #29 from DV8FromTheWorld/master (a4a3f2d)
    • Remove reliance on internal Vue property (82cf380)
    • Update component data sync for Vue3 internal channges (9c339fe)
    Source code(tar.gz)
    Source code(zip)
  • 3.0.0-beta.6(Oct 5, 2021)

    • Merge pull request #27 from inmar/vue3/beforeDestroy (2295211)
    • update(beforeDestroy): Update beforeDestroy hook to be beforeUnmount as per Vue3 docs (8492e6b)
    • chore: update funding (189006e)
    Source code(tar.gz)
    Source code(zip)
  • 3.0.0-beta.5(Sep 23, 2021)

  • 3.0.0-beta.4(Aug 23, 2021)

  • 3.0.0-beta.2(Sep 26, 2020)

    • chore: use release-it for releases (1cf951d)
    • tests: add unit tests (afe275d)
    • chore: update readme (7b58e8e)
    • feat: support vuejs 3 (ba4f286)
    • chore(build): use commonJS (b5b9c06)
    • chore(build): add runtime transformation (8001199)
    • chore(build): add ie11 compatibility (52f1b17)
    • fix(bundle): update dependencies (7525cce)
    • Merge branch 'master' of github.com:alexander-heimbuch/redux-vuex (80f8645)
    • fix(bundle): update dependencies (1e8a0e2)
    • Create FUNDING.yml (1405510)
    • chore: bump package version (e2bac5e)
    • Merge pull request #8 from alexander-heimbuch/feature/dynamic-store-binding (31d7a1c)
    • feat: add dynamic store binding (d418a0b)
    • Merge pull request #7 from steve-low/master (ae00812)
    • return the result of store.dispatch (6f71272)
    • Merge pull request #5 from Raigasm/master (ec4ff98)
    • fixed missing bar (5116dcf)
    • docs(README): improve clarity of mapState documentation (760d4bf)
    • Merge pull request #4 from Letty/patch-1 (418c810)
    • Fix Readme Typos (e2249ea)
    • chore(package): bumps package version (e2ac005)
    • chore(readme): updates readme (d6ab9eb)
    • Merge pull request #3 from alexander-heimbuch/fix/mapstate-props (730552e)
    • fix(mapstate): Fixes mapstate on component binding (45e2120)
    • Update README.md (fcedee6)
    • chore(build): adds umd build for better compatibility (23c6b38)
    • Merge pull request #1 from herrmannplatz/patch-1 (01e731a)
    • adds return statement to custom actions (dee801e)
    • fix typo in readme (f72934b)
    • update package name (6e2866e)
    • init (41c8b7d)
    Source code(tar.gz)
    Source code(zip)
Owner
Alexander Heimbuch
Frontend Developer with a passion for VueJS and Angular. Convinced in FOSS.
Alexander Heimbuch
πŸ– A concise & flexible state model for Redux/MobX/Vuex, etc.

USM USM is a universal state modular library, supports Redux(4.x), MobX(6.x), Vuex(4.x) and Angular(2.0+). Support Libraries/Frameworks None Redux Mob

Michael Lin 281 Dec 4, 2022
Binding Solutions for Vue & Redux

vuedeux Full Documentation https://vueduex.gitbooks.io/vuedeux-documentation/content/ Synopsis Vuedeux is a lightweight open-source utility layer for

null 70 Aug 28, 2022
Flexible binding between Vue and Redux

vuejs-redux Description Flexible binding between Vue and Redux, allowing use of multiple stores. It works, in the same way, like render props does in

Titouan CREACH 58 Nov 24, 2022
A tiny Vue plugin that connects components with Redux

redux-connect-vue **Note: redux-connect-vue v3 is compatible with Vue 3.x. If you are looking for a Vue 2.x compatible version, check out v2 A tiny Vu

Kai Johnson 3 May 23, 2022
A tiny Vue plugin that connects Vue Router with Redux

redux-first-vue-routing A tiny Vue plugin that connects Vue Router with Redux, an implementation of redux-first-routing. New to Redux? Start Here Achi

Kai Johnson 4 Apr 27, 2022
πŸ“¦ Fast, Simple, and Lightweight State Manager for Vue 3.0 built with composition API, inspired by Vuex.

v-bucket NPM STATUS: ?? Fast, Simple, and Lightweight State Management for Vue 3.0 built with composition API, inspired by Vuex. Table of Contents Mai

mehdi 42 Aug 10, 2022
Lightweight vuex inspired centralized state management library for all kinds of javascript applications. Great for React Native.

Verx Lightweight vuex inspired centralized state management library for all kinds of javascript applications. install npm install --save verx # yarn a

Jaynti Kanani 3 Nov 4, 2019
vuex-module-generator - It allows you to create a vuex module easily.

Vuex Module Generator (VMG) VMG allows you to create a vuex module easily. See All implementations. See Customer Example. Supported module types Clone

Abdullah 91 Dec 28, 2022
The Vuex plugin to enable Object-Relational Mapping access to the Vuex Store.

Vuex ORM ?? HEADS UP! Currently, Vuex ORM Next project is on going, and we are hoping it is going to be the foundation of the version 1.0.0 release. W

Vuex ORM 2.4k Dec 29, 2022
Todos-VUEX - A todo list made using Vue, Vuex, Axios and JSON Placeholder API.

todos Project setup npm install Compiles and hot-reloads for development npm run serve Compiles and minifies for production npm run build Lints and

Lasanja 0 Jan 3, 2022
Elm-inspired Application State Management for Vue.js.

VuElm It's a Vue state management inspired by Elm architecture. Concepts There are basically four elements on Elm architecture: Model, Actions, Update

Keuller MagalhΓ£es 36 May 5, 2021
A state management library for react inspired by vue 3.0 reactivity api and immer

Welcome to costate ?? A state management library for react inspired by vue 3.0 reactivity api and immer costate is a tiny package that allows you to w

ε·₯业聚 7 Mar 29, 2022
A project to demonstrate the use of Store and state, getters, mutations in Vuex and VueJS

Vuex State Sample ?? ?? A project to demonstrate the use of Store and state, getters, mutations in Vuex and VueJS. Create Vuex Store and use it to hol

Yufenyuy Veyeh Didier 0 Apr 13, 2020
A mostly reasonable alternative to Vuex

Tuex (beta) A simpler Vuex alternative written in TypeScript. (TypeScript + Vuex) - Complexity = Tuex Full Documentation About Tuex is a reactive cent

Alexey Iskhakov 32 Nov 24, 2022
:seedling: Vue and vuex based library, writing less verbose code.

lue ?? Vue and vuex based library, writing less verbose code. Installation Install the pkg with npm: npm install lue --save or yarn yarn add lue Bas

Pomy 12 Jul 30, 2020
πŸ’Ύ Persist and rehydrate your Vuex state between page reloads.

vuex-persistedstate Persist and rehydrate your Vuex state between page reloads. Install npm install --save vuex-persistedstate The UMD build is also a

Robin van der Vleuten 5.8k Jan 5, 2023
A Vuex plugin to persist the store. (Fully Typescript enabled)

vuex-persist A Typescript-ready Vuex plugin that enables you to save the state of your app to a persisted storage like Cookies or localStorage. Info :

Arnav Gupta 1.6k Dec 30, 2022
Enable two-way data binding for form fields saved in a Vuex store

vuex-map-fields Enable two-way data binding for form fields saved in a Vuex store. Install npm install --save vuex-map-fields Basic example The follow

Markus Oberlehner 1.4k Dec 2, 2022
Share vuex mutations between tabs/windows

vuex-shared-mutations Share certain Vuex mutations across multiple tabs/windows. Basic example Nuxt example Installation $ npm install vuex-shared-mut

Illya Klymov 566 Dec 12, 2022