vuex-class可以包装vuex的写法,使代码简化

Installation

$ npm install --save vuex-class

Example

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['module/foo']   } }

vuex-class用法的更多相关文章

  1. Vuex 常规用法

    背景 很多时候我们已经熟悉了框架的运用,但是有时候就是忘了怎么用 所以这里想记下大部分的框架使用方法,方便使用的时候拷贝 一.安装 npm 方式 npm install vuex --save yar ...

  2. vue vuex的用法

    1.引入  vue.js    vuex.js 文件 2.创建Store文件 var sSatte=new Vuex.Store({ state:{}, mutations:{}, actions:{ ...

  3. vuex 基本用法、兄弟组件通信,参数传递

    vuex主要是是做数据交互,父子组件传值可以很容易办到,但是兄弟组件间传值,需要先将值传给父组件,再传给子组件,异常麻烦. vuex大概思路:a=new Vue(),发射数据'msg':a.$emit ...

  4. vuex的用法

    https://segmentfault.com/a/1190000015782272

  5. [js高手之路]Vue2.0基于vue-cli+webpack Vuex用法详解

    在这之前,我已经分享过组件与组件的通信机制以及父子组件之间的通信机制,而我们的vuex就是为了解决组件通信问题的 vuex是什么东东呢? 组件通信的本质其实就是在组件之间传递数据或组件的状态(这里将数 ...

  6. vue中vuex的五个属性和基本用法

    VueX 是一个专门为 Vue.js 应用设计的状态管理构架,统一管理和维护各个vue组件的可变化状态(你可以理解成 vue 组件里的某些 data ). Vuex有五个核心概念: state, ge ...

  7. vue2.0项目实战(5)vuex快速入门

    Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化.Vuex 也集成到 Vue 的官方调试工具  ...

  8. 09:vuex组件间通信

    1.1 vuex简介 官网:https://vuex.vuejs.org/zh/guide/ 参考博客:https://www.cnblogs.com/first-time/p/6815036.htm ...

  9. 一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app

    一步一步教你用 Vue.js + Vuex 制作专门收藏微信公众号的 app 转载 作者:jrainlau 链接:https://segmentfault.com/a/1190000005844155 ...

  10. 4 vuex的安装

    安装可以看,引入又问题https://blog.csdn.net/u014196765/article/details/78022065?locationNum=9&fps=1(引入) htt ...

随机推荐

  1. sublime text 3 15个常用插件介绍

    1.ColorPicker 功能:调色板(需要输入颜色时,可直接选取颜色) 使用:快捷键Windows: ctrl+shift+c 2.Emmet 功能:编码快捷键,前端必备 使用:在输入代码段后,按 ...

  2. 跟着大彬读源码 - Redis 10 - 对象编码之整数集合

    [TOC] 整数集合是 Redis 集合键的底层实现之一.当一个集合只包含整数值元素,并且元素数量不多时,Redis 就会使用整数集合作为集合键的底层实现. 1 整数集合的实现 整数集合是 Redis ...

  3. 为什么我们不用JIRA

    很多人问我,缺陷管理工具,为什么不用jira?而去自己造轮子开发一款bug记录系统 缄默如我,原因众多.如果只是3-5分钟就能讲的请的时候,我会先列出什么糟点呢? 1. 收费,一个人一个月的费用差不多 ...

  4. element ui 退出功能

    <template> <el-container class="home-wrapper"> <el-header> <el-row ty ...

  5. php 中session_set_cookie_params 和 setcookie 函数的区别与用法

    session_set_cookie_params() 函数不管刷不刷新页面,都不会改变cookie的过期时间, 但setcookie() 函数页面每刷新一次,cookie 的过期时间就会刷新一次. ...

  6. 使用PIP键盘输入数字小数位--Smart LCD

    应用范例: 使用TOPWAY Smart LCD (HMT050CC-C) 使用PIP键盘输入数字小数位 第一步 建立工程 第二步 建立三个页面,导入图片 点击工作区域, 右面显示页面属性 属性中Ba ...

  7. 重学计算机组成原理(十一)- 门电路的"千里传音"

    人用纸和笔来做运算,都是用十进制,直接用十进制和我们最熟悉的符号不是最简单么? 为什么计算机里我们最终要选择二进制呢? 来看看,计算机在硬件层面究竟是怎么表示二进制的,你就会明白,为什么计算机会选择二 ...

  8. 解决 Nginx 代理Apex慢的问题

    前不久用 Nginx 代理 Oracle 的 Apex 速度非常慢,我之前Nginx 配置如下: server{ listen 80; server_name localhost; client_ma ...

  9. Linux--shell数组和字符串--09

    一.数组 数组就是一段连续的变量,一段连续的内存存储空间,为了解决变量过多的问题,在同一类变量中,我们不需要去定义多个名字,而是以数组的方式来定义 1.定义数组 declare -a 定义数组 dec ...

  10. Redis的常用命令与Java整合及高级应用篇

    一,redis是什么? ​ 首先数据库分为关系型数据库和非关系型数据库,关系型数据库是采用关系模型来组织数据的数据库,简单来说就是二维表格模型,同时保证事务的一致性. ​ 相反非关系型数据库采用key ...