https://github.com/ktsn/vuex-class

Binding helpers for Vuex and vue-class-component
https://github.com/ktsn/vuex-class

vue vuex

Last synced: about 2 months ago
JSON representation

Binding helpers for Vuex and vue-class-component

• Host: GitHub
• URL: https://github.com/ktsn/vuex-class
• Owner: ktsn
• License: mit
• Created: 2017-01-14T11:00:20.000Z (over 7 years ago)
• Default Branch: master
• Last Pushed: 2020-10-12T13:31:47.000Z (almost 4 years ago)
• Last Synced: 2024-05-22T05:42:28.292Z (4 months ago)
• Topics: vue, vuex
• Language: TypeScript
• Size: 158 KB
• Stars: 1,728
• Watchers: 18
• Forks: 86
• Open Issues: 21
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

• awesomeLibrary - vuex-class - Binding helpers for Vuex and vue-class-component. (语言资源库 / typescript)

README

        
# vuex-class

[![vuex-class Dev Token](https://badge.devtoken.rocks/vuex-class)](https://devtoken.rocks/package/vuex-class)

Binding helpers for Vuex and vue-class-component

## Dependencies

- [Vue](https://github.com/vuejs/vue)

- [Vuex](https://github.com/vuejs/vuex)

- [vue-class-component](https://github.com/vuejs/vue-class-component)

## Installation

```bash

$ npm install --save vuex-class

# or

$ yarn add vuex-class

```

## Example

```js

import Vue from 'vue'

import Component from 'vue-class-component'

import {

  State,

  Getter,

  Action,

  Mutation,

  namespace

} from 'vuex-class'

const someModule = namespace('path/to/module')

@Component

export class MyComp extends Vue {

  @State('foo') stateFoo

  @State(state => state.bar) stateBar

  @Getter('foo') getterFoo

  @Action('foo') actionFoo

  @Mutation('foo') mutationFoo

  @someModule.Getter('foo') moduleGetterFoo

  // If the argument is omitted, use the property name

  // for each state/getter/action/mutation type

  @State foo

  @Getter bar

  @Action baz

  @Mutation qux

  created () {

    this.stateFoo // -> store.state.foo

    this.stateBar // -> store.state.bar

    this.getterFoo // -> store.getters.foo

    this.actionFoo({ value: true }) // -> store.dispatch('foo', { value: true })

    this.mutationFoo({ value: true }) // -> store.commit('foo', { value: true })

    this.moduleGetterFoo // -> store.getters['path/to/module/foo']

  }

}

```

## Issue Reporting Guideline

### Questions

For general usage question which is not related to vuex-class should be posted to [StackOverflow](https://stackoverflow.com/) or other Q&A forum. Such questions will be closed without an answer.

### Bug Reports

Please make sure to provide minimal and self-contained reproduction when you report a bug. Otherwise the issue will be closed immediately.

## License

MIT