🏖 A concise & flexible state model for Redux/MobX/Vuex, etc.

Overview

USM

Node CI npm

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 MobX Vuex Angular2+
Status

Installation

To install usm:

yarn add usm # npm install --save usm

And if you want to use Redux/MobX/Vuex, you just install usm-redux/usm-mobx/usm-vuex.

Usage

  • Use @state to decorate a module state.

  • Use @action to decorate a module method for state changes.

  • Use createStore to create a store.

import { state, action, createStore } from 'usm';
// You can also use `usm-redux`, `usm-mobx`, or`usm-vuex`.

class Counter {
  @state
  count = { sum: 0 };

  @action
  increase() {
    this.count.sum += 1;
  }
}

const counter = new Counter();

const store = createStore({
  modules: [counter],
});

counter.increase();

const newState = Object.values(store.getState())[0] as Counter;
expect(newState.count).toEqual({ sum: 1 });

Examples

APIs

@state

Define a shared state for a module, and you can use @state for decoration. When use usm-redux, the state is not allowed to be undefined.

For example,

class Counter {
  @state
  number = 0;
}

@action

All operations that change state must be in a method decorated by @action.

For example,

class Counter {
  @state
  number = 0;

  @action
  increase() {
    this.number += 1;
  }
}

@computed/@computed()

It is used for computing derived data.

  • When use usm or usm-redux, you should use @computed(depsCallback), The return value of the depsCallback is an array of dependent value collections that tells the module that its getter will recompute when there is a change in any of the values in the value collections:

For example,

class Counter {
  @state
  count = { sum: 0 };

  @state
  number = 0;

  @action
  increase() {
    this.number += 1;
  }

  @computed((that) => [that.count.sum, that.number])
  get sum() {
    return this.count.sum + this.number;
  }
}
  • When use usm-mobx or usm-vuex, you just use @computed, Since it is an observable model, its dependency collection is automatic:

For example,

class Counter {
  @state
  count = { sum: 0 };

  @state
  number = 0;

  @action
  increase() {
    this.number += 1;
  }

- @computed((that) => [that.count.sum, that.number])
+ @computed
  get sum() {
    return this.count.sum + this.number;
  }
}

createStore()

Creates a usm store that holds the complete shared state.

Arguments

  • options(object)
    • modules(array): an array with all modules instances
    • [strict] (boolean): enable strict mode
  • [preloadedState] (any): preloaded state
  • [plugins/middleware] (any[]): vuex's plugins or redux's middleware

For example,

class Counter {
  @state
  number = 0;

  @action
  increase() {
    this.number += 1;
  }
}

const counter = new Counter();

const store = createStore({
  modules: [counter],
});

subscribe()

You can use subscribe() to subscribe state changes in any class module.

For example,

class Counter {
  constructor() {
    subscribe(this, () => {
      //
    });
  }

  @state
  count = { sum: 0 };
}

watch()

You can use watch() to observe a specific state changes in any class module.

For example,

class Counter {
  constructor() {
    watch(
      this,
      () => this.count.sum,
      (newValue, oldValue) => {
        //
      }
    );
  }

  @state
  count = { sum: 0 };
}

You can pass the option { multiple: true }, which will support watching multiple values.

For example,

class Counter {
  constructor() {
    watch(
      this,
      () => [this.count0, this.count1],
      ([newCount0, newCount1], [oldCount0, oldCount0]) => {
        //
      },
      {
        multiple: true,
      }
    );
  }

  @state
  count0 = 0;

  @state
  count1 = 0;
}

watch option supports passing in isEqual function for custom equal.

Comments
  • "watch" deep equality

    I have been using the watch function like so:

    import { app } from '../store' // App is a module class
    
    watch(
        app,
        () => app.customer,
        () => {
            // Do something with data
        }
    );
    

    However, I want to now watch for two properties at the same time

    watch(
        app,
        () => [app.customer, app.announcement],
        () => {
            // Do something with data
        }
    );
    

    The watch function seems to use a === check for equality but I don't think this captures all the changes that may occur. What if a nested property changes, I don't believe the current logic will catch it.

    opened by rwest202 6
  • How to use it with redux devtools?

    How to use it with redux devtools?

    in this post ( https://unadlib.medium.com/a-concise-design-that-completely-changed-redux-e95d6b76bd8b ) you've commented that it can be used with redux-devtools. But its not showing the states or actions. any solution?

    opened by xoka4 4
  • any nextjs examples?

    any nextjs examples?

    Hello, thanks for creating this amazing library. I just wanted to test it out with nextjs & not sure, what I've done wrong, but I'm getting this error: image

    Is there any nextjs example with usm-redux? Thanks

    opened by p32929 4
  • example use @computed decorator

    example use @computed decorator

    how to use a computed decorator?

    i tried but got an error @computed accessToken = this.token

    and the error Cannot set property accessToken of #<Auth> which has only a getter

    opened by riskihajar 2
  • usm-redux可以嵌入到传统redux里面吗?

    usm-redux可以嵌入到传统redux里面吗?

    例如,我目前维护的项目是用redux写的,以后的新的模块我想用usm-redux写。redux里面的combineReducers可以把usm-redux写的模块嵌入到进去吗?例如类似这样:

    
    import { createStore, combineReducers } from 'redux'
    import Module, { state, action } from 'usm-redux';
    
    const setVisibilityFilter = filter => {
      return {
        type: 'SET_VISIBILITY_FILTER',
        filter
      }
    }
    
    // reducers
    class TodoList extends Module {
      @state todos = [];
      nextTodoId = 0;
    
      @action
      add(text, state) {
        this.nextTodoId++;
        state.todos.push({
          text,
          id: this.nextTodoId,
          completed: false,
        });
      }
    
      @action
      toggle(id, state) {
        const todo = state.todos.find(todo => todo.id === id);
        todo.completed = !todo.completed;
      }
    }
    
    const visibilityFilter = (state = 'SHOW_ALL', action) => {
      switch (action.type) {
        case 'SET_VISIBILITY_FILTER':
          return action.filter
        default:
          return state
      }
    }
    
    const todos = new TodoList
    
    const todoApp = combineReducers({
      // 将usm-redux模块转为redux模块
      todos: toReduxReducer(todos),
      visibilityFilter
    })
    
    opened by laden666666 2
  • build(deps): bump terser from 5.7.1 to 5.14.2

    build(deps): bump terser from 5.7.1 to 5.14.2

    Bumps terser from 5.7.1 to 5.14.2.

    Changelog

    Sourced from terser's changelog.

    v5.14.2

    • Security fix for RegExps that should not be evaluated (regexp DDOS)
    • Source maps improvements (#1211)
    • Performance improvements in long property access evaluation (#1213)

    v5.14.1

    • keep_numbers option added to TypeScript defs (#1208)
    • Fixed parsing of nested template strings (#1204)

    v5.14.0

    • Switched to @​jridgewell/source-map for sourcemap generation (#1190, #1181)
    • Fixed source maps with non-terminated segments (#1106)
    • Enabled typescript types to be imported from the package (#1194)
    • Extra DOM props have been added (#1191)
    • Delete the AST while generating code, as a means to save RAM

    v5.13.1

    • Removed self-assignments (varname=varname) (closes #1081)
    • Separated inlining code (for inlining things into references, or removing IIFEs)
    • Allow multiple identifiers with the same name in var destructuring (eg var { a, a } = x) (#1176)

    v5.13.0

    • All calls to eval() were removed (#1171, #1184)
    • source-map was updated to 0.8.0-beta.0 (#1164)
    • NavigatorUAData was added to domprops to avoid property mangling (#1166)

    v5.12.1

    • Fixed an issue with function definitions inside blocks (#1155)
    • Fixed parens of new in some situations (closes #1159)

    v5.12.0

    • TERSER_DEBUG_DIR environment variable
    • @​copyright comments are now preserved with the comments="some" option (#1153)

    v5.11.0

    • Unicode code point escapes (\u{abcde}) are not emitted inside RegExp literals anymore (#1147)
    • acorn is now a regular dependency

    v5.10.0

    • Massive optimization to max_line_len (#1109)
    • Basic support for import assertions
    • Marked ES2022 Object.hasOwn as a pure function
    • Fix delete optional?.property
    • New CI/CD pipeline with github actions (#1057)

    ... (truncated)

    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
  • build(deps): bump ansi-regex from 3.0.0 to 3.0.1

    build(deps): bump ansi-regex from 3.0.0 to 3.0.1

    Bumps ansi-regex from 3.0.0 to 3.0.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] 1
  • build(deps): bump tar from 4.4.13 to 4.4.15

    build(deps): bump tar from 4.4.13 to 4.4.15

    Bumps tar from 4.4.13 to 4.4.15.

    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
  • build(deps): bump ws from 7.3.1 to 7.5.1

    build(deps): bump ws from 7.3.1 to 7.5.1

    Bumps ws from 7.3.1 to 7.5.1.

    Release notes

    Sourced from ws's releases.

    7.5.1

    Bug fixes

    • Fixed an issue that prevented the connection from being closed properly if an error occurred simultaneously on both peers (b434b9f1).

    7.5.0

    Features

    • Some errors now have a code property describing the specific type of error that has occurred (#1901).

    Bug fixes

    • A close frame is now sent to the remote peer if an error (such as a data framing error) occurs (8806aa9a).
    • The close code is now always 1006 if no close frame is received, even if the connection is closed due to an error (8806aa9a).

    7.4.6

    Bug fixes

    • Fixed a ReDoS vulnerability (00c425ec).

    A specially crafted value of the Sec-Websocket-Protocol header could be used to significantly slow down a ws server.

    for (const length of [1000, 2000, 4000, 8000, 16000, 32000]) {
      const value = 'b' + ' '.repeat(length) + 'x';
      const start = process.hrtime.bigint();
    

    value.trim().split(/ *, */);

    const end = process.hrtime.bigint();

    console.log('length = %d, time = %f ns', length, end - start); }

    The vulnerability was responsibly disclosed along with a fix in private by Robert McLaughlin from University of California, Santa Barbara.

    In vulnerable versions of ws, the issue can be mitigated by reducing the maximum allowed length of the request headers using the --max-http-header-size=size and/or the maxHeaderSize options.

    7.4.5

    Bug fixes

    ... (truncated)

    Commits
    • 38c6c73 [dist] 7.5.1
    • 2916006 [test] Add more tests for WebSocket.prototype.close()
    • b434b9f [fix] Fix close edge cases
    • c3fdc99 [minor] Fix misleading comment
    • 145480a [test] Fix repeated typo
    • e3f0c17 [dist] 7.5.0
    • 1d3f4cb [doc] Fix anchor tags for error codes
    • 6eea0d4 [doc] Fix typo
    • bb5d44b [doc] Sort error codes alphabetically
    • c6e3080 [minor] Attach error codes to all receiver errors (#1901)
    • 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] 1
  • build(deps-dev): bump glob-parent from 5.1.1 to 5.1.2

    build(deps-dev): bump glob-parent from 5.1.1 to 5.1.2

    Bumps glob-parent from 5.1.1 to 5.1.2.

    Release notes

    Sourced from glob-parent's releases.

    v5.1.2

    Bug Fixes

    Changelog

    Sourced from glob-parent's changelog.

    5.1.2 (2021-03-06)

    Bug Fixes

    6.0.0 (2021-05-03)

    ⚠ BREAKING CHANGES

    • Correct mishandled escaped path separators (#34)
    • upgrade scaffold, dropping node <10 support

    Bug Fixes

    • Correct mishandled escaped path separators (#34) (32f6d52), closes #32

    Miscellaneous Chores

    • upgrade scaffold, dropping node <10 support (e83d0c5)
    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
  • build(deps): bump ws from 7.3.1 to 7.4.6

    build(deps): bump ws from 7.3.1 to 7.4.6

    Bumps ws from 7.3.1 to 7.4.6.

    Release notes

    Sourced from ws's releases.

    7.4.6

    Bug fixes

    • Fixed a ReDoS vulnerability (00c425ec).

    A specially crafted value of the Sec-Websocket-Protocol header could be used to significantly slow down a ws server.

    for (const length of [1000, 2000, 4000, 8000, 16000, 32000]) {
      const value = 'b' + ' '.repeat(length) + 'x';
      const start = process.hrtime.bigint();
    

    value.trim().split(/ *, */);

    const end = process.hrtime.bigint();

    console.log('length = %d, time = %f ns', length, end - start); }

    The vulnerability was responsibly disclosed along with a fix in private by Robert McLaughlin from University of California, Santa Barbara.

    In vulnerable versions of ws, the issue can be mitigated by reducing the maximum allowed length of the request headers using the --max-http-header-size=size and/or the maxHeaderSize options.

    7.4.5

    Bug fixes

    • UTF-8 validation is now done even if utf-8-validate is not installed (23ba6b29).
    • Fixed an edge case where websocket.close() and websocket.terminate() did not close the connection (67e25ff5).

    7.4.4

    Bug fixes

    • Fixed a bug that could cause the process to crash when using the permessage-deflate extension (92774377).

    7.4.3

    Bug fixes

    • The deflate/inflate stream is now reset instead of reinitialized when context takeover is disabled (#1840).

    7.4.2

    Bug fixes

    ... (truncated)

    Commits
    • f5297f7 [dist] 7.4.6
    • 00c425e [security] Fix ReDoS vulnerability
    • 990306d [lint] Fix prettier error
    • 32e3a84 [security] Remove reference to Node Security Project
    • 8c914d1 [minor] Fix nits
    • fc7e27d [ci] Test on node 16
    • 587c201 [ci] Do not test on node 15
    • f672710 [dist] 7.4.5
    • 67e25ff [fix] Fix case where abortHandshake() does not close the connection
    • 23ba6b2 [fix] Make UTF-8 validation work even if utf-8-validate is not installed
    • 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] 1
Releases(v4.0.0)
Owner
Michael Lin
Michael Lin
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
:smile: :star: :innocent: Mobx binding for Vuejs 2.

vue-mobx Mobx binding for Vue. Only supports Vuejs 2.x & Mobx 2.2.x or higher. Installation Install the pkg with npm: npm install vue-mobx --save or

Pomy 110 Nov 21, 2022
MobX integration for Vue.js.

Movue MobX integration for Vue.js, inspired by vue-rx. Movue aims for providing simple and reliable integration between Mobx and Vue.js, which sometim

Hanxing Yang 57 Nov 21, 2022
Vuex plugin for redux-saga

vuex-coolstory Use redux-saga with Vuex. Overview redux-saga is an awesome library that aims to make side effects (i.e. asynchronous things like data

Nikita Lvov 23 Apr 2, 2022
Redux bindings for VueJS inspired by Vuex.

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

Alexander Heimbuch 39 Dec 14, 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
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
Model component for Vue.js

About Vue-model is a Javascript plugin for Vue.js that gives you the ability to transform your plain data into rich models with built-in and customiza

Aaron Francis 865 Oct 19, 2022
Universal Model for Vue

Universal Model for Vue Universal model is a model which can be used with any of following UI frameworks: Angular 2+ universal-model-angular React 16.

Universal Model 25 Feb 14, 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
💾 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
Vuex state synchronization between iframe/window

vuex-iframe-sync English | 中文 Vuex state synchronization between iframe/window Your star is the greatest encouragement to me. ✨ Features: support ifra

Jiahui.Liang 101 Dec 17, 2022
💾🔗🖥️ Share, synchronize and persist state between multiple tabs with this plugin for Vuex. TypeScript types included.

vuex-multi-tab-state This Vuex plugin allows you to sync and share the status of your Vue application across multiple tabs or windows using the local

Gabriel Martín Blázquez 155 Nov 19, 2022
Vuex state persistance and synchronization between tabs/windows.

vuex-basement Vuex state persistance and synchronization between tabs/windows. Tested to work with Vue2. One Shortcomming (please read before use). Th

Rashad Saleh 65 Jun 29, 2022
Local state management within Vuex

vuex-local Local state management within Vuex Why? Global state management is one of the problems on huge application development. Developers address

Katashin 64 Nov 11, 2022
Simplify vuex loading state management

vuex-loading Simplify vuex loading state management Installing Using npm: $ npm install vuex-loadings -s Know Simplify vuex loading state management n

zhoulin 3 Jul 30, 2020
A vue boiler plate with state management, vuex, vue-router that can be backed by a laravel restful api using jwt auth

Laravel 6 (LTS) Vue.js Frontend Boilerplate A Vue.js Frontend starter project kit template/boilerplate with Laravel 6 Backend API support. Features Re

MUWONGE HASSAN 2 Oct 12, 2021
Simple counter with Vue.js and Vuex as state management

vuex-counter Project setup npm install Compiles and hot-reloads for development npm run serve Compiles and minifies for production npm run build Li

Kevin Hamdajani 0 Dec 30, 2021