Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/dwqs/revuejs
:rabbit2: A tiny, light and handy state management for vuejs 2, writing less verbose code.
https://github.com/dwqs/revuejs
modules state-management vue vuejs2
Last synced: 26 days ago
JSON representation
:rabbit2: A tiny, light and handy state management for vuejs 2, writing less verbose code.
- Host: GitHub
- URL: https://github.com/dwqs/revuejs
- Owner: dwqs
- License: mit
- Created: 2017-08-04T07:05:23.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2018-02-28T16:03:32.000Z (about 6 years ago)
- Last Synced: 2024-01-08T08:50:20.331Z (5 months ago)
- Topics: modules, state-management, vue, vuejs2
- Language: JavaScript
- Homepage:
- Size: 136 KB
- Stars: 24
- Watchers: 3
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Lists
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Components & Libraries / Utilities)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Components & Libraries / Utilities)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Components & Libraries / Utilities)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Components & Libraries / Utilities)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Components & Libraries / Utilities)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Components & Libraries / Utilities)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Components & Libraries / Utilities)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Components & Libraries / Utilities)
- awesome-vue. - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Utilities / State Management)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Components & Libraries / Utilities)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Utilities / State Management)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Utilities / State Management)
- awesome-vue - revuejs ★21 - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Utilities / State Management)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Utilities / State Management)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Utilities / State Management)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Utilities / State Management)
- awesome-vue - revuejs - A tiny, light and handy state management for vuejs 2, writing less verbose code. (Components & Libraries / Utilities)
README
[](https://travis-ci.org/dwqs/revuejs) [](http://standardjs.com)   
# revuejs
:rabbit2: A tiny, light and handy state management for vuejs 2, writing less verbose code.
## Installation
Install the pkg with npm:
```
npm install revuejs --save
```
or yarn
```
yarn add revuejs
```
or bower
```
bower install revuejs
```
You can also hot-link the CDN version: https://unpkg.com/revuejs/dist/index.js, `Revuejs` is exposed to `window` object.
## Basic Uasage
#### 1. create a module
```js
// hello.js
export default {
namespace: 'hello',
state: {
title: 'hello'
},
actions: {
changeTitle(state, payload) {
// return a new state
return Object.assign({}, state, {
title: payload.title
});
},
async testAsync(state, payload) {
await Promise.resolve(2);
if(err) {
return {
msg: 'request error'
}
}
return {
title: 'async test'
};
}
}
}
```
#### 2. create modules using the module you created
```js
// modules/index.js
import Vue from 'vue';
import Revuejs, { Modules } from 'revuejs';
Vue.use(Revuejs);
import hello from 'path/to/hello';
import otherModule from 'path/to/other-module';
const modules = new Modules({
hello,
otherModule
// others
});
export default modules;
```
#### 3. use it with Vue instance
```js
import Vue from 'vue';
import modules from 'path/to/modules/index';
// ...
const app = new Vue({
// ...
modules,
// ...
});
app.$mount('#app');
```
#### 4. combine Revuejs with Vue components
```js
{{title}}
update title
import {mergeActions, mergeProps} from 'revuejs';
export default {
computed: {
...mergeProps(['hello.title', 'hello.info'])
// or
// ...mergeProps({
// test: 'hello.title',
// })
},
methods: {
...mergeActions(['hello.changeTitle']),
update(){
this.changeTitle({
title: 'will be update title'
});
}
}
}
```
## Docs
[View the docs here](https://github.com/dwqs/revuejs/wiki).
## Examples
Running the examples:
```
npm install
npm run dev # serve examples at localhost:8000
```
## Thanks
Thanks to [vuex](https://github.com/vuejs/vuex) for the head start.
## LICENSE
MIT