store.js

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
const store = new Vuex.Store({
state: {
count: 0
},
mutations: {
increment (state) {
state.count++
},
decrement (state) {
state.count--
}
},
actions: {
increment (context) {
context.commit('increment')
},
decrement (context) {
context.commit('decrement')
}
},
getters: {
odd:state => state.count
}
})
export default store

组件:

mapState的更多相关文章

  1. vue:vuex中mapState、mapGetters、mapActions辅助函数及Module的使用

    一.普通store中使用mapState.mapGetters辅助函数: 在src目录下建立store文件夹: ​ index.js如下: import Vue from 'vue'; import ...

  2. vuex mapState、mapGetters、mapActions、mapMutations的使用

    例子: index.js import Vue from 'vue' import Vuex from 'vuex' import mutations from './mutations' impor ...

  3. vuex之 mapState, mapGetters, mapActions, mapMutations 的使用

    一.介绍 vuex里面的四大金刚:State, Mutations,Actions,Getters (上次记得关于vuex笔记 http://www.cnblogs.com/adouwt/p/8283 ...

  4. 理解Vuex的辅助函数mapState, mapActions, mapMutations用法

    在讲解这些属性之前,假如我们项目的目录的结构如下: ### 目录结构如下: demo1 # 工程名 | |--- dist # 打包后生成的目录文件 | |--- node_modules # 所有的 ...

  5. vuex中的辅助函数 mapState,mapGetters, mapActions, mapMutations

    1.导入辅助函数 导入mapState可以调用vuex中state的数据 导入mapMutations可以调用vuex中mutations的方法 四个辅助函数 各自对应自己在vuex上的自己 2.ma ...

  6. vuex学习与实践——mapState、getter、mapGetters

    1.mapState辅助函数 当一个组件需要获取多个状态时候,将这些状态都声明为计算属性会有些重复和冗余.为了解决这个问题,我们可以使用 mapState 辅助函数帮助我们生成计算属性,让你少按几次键 ...

  7. vuex里mapState,mapGetters使用详解

    这次给大家带来vuex里mapState,mapGetters使用详解,vuex里mapState,mapGetters使用的注意事项有哪些,下面就是实战案例,一起来看一下. 一.介绍 vuex里面的 ...

  8. vuex 源码:深入 vuex 之辅助函数 mapState

    前言 当一个组件要获取多个 state 的时候,声明计算属性就会变得重复和冗余了.我们可以使用到辅助函数 mapState 来更快更简洁地生成计算属性. 所以我们得清楚,mapState 的作用就是帮 ...

  9. vuex this.$store.state.属性和mapState的属性中的一点点区别

    做泰康公众号的项目时候有一个需求创建公众号的时候后台有一个社区id提供给后台展现人员和部门,在群发消息时候也要给后台一个社区id只不过获取社区的id接口和上一个不是一样的,本来在页面中写了两个sele ...

  10. vuex 温故而知新 mapState的使用

    虽然早就知道 mapState 的存在,但还是极少使用.最近代码的computed变多才开始意识到好处. 原来的代码: computed: { findLastSixMonthAir () { ret ...

随机推荐

  1. Zabbix 3.4.7针对一些主机设置期间维护

    场景说明: 由于公司有些主机设置了定时开机关机,每次开机关机得时候都会发邮件告警,每次都需要值班人员提醒,为了处理这种无效告警,可以在zabbix中设置维护 zabbix中的维护---维护期间:用来设 ...

  2. isPrototypeOf、instanceof、hasOwnProperty函数介绍

    isPrototypeOf 作用:检测一个对象是否是另一个对象的原型.或者说一个对象是否被包含在另一个对象的原型链中 var p = {x:1};//定义一个原型对象 var o = Object.c ...

  3. 【转】Android辅助功能AccessibilityService自动全选择文字粘贴模拟输入

    网上找了很久AccessibilityService全选文字的方法,一直没找到,自己研究了半天,分享出来. /** * 输入文本 */ public void inputText(List<St ...

  4. Python爬虫 爬取百合网的女人们和男人们

    学Python也有段时间了,目前学到了Python的类.个人感觉Python的类不应称之为类,而应称之为数据类型,只是数据类型而已!只是数据类型而已!只是数据类型而已!重要的事情说三篇. 据书上说一个 ...

  5. 容器中的JVM资源该如何被安全的限制?

    前言 Java与Docker的结合,虽然更好的解决了application的封装问题.但也存在着不兼容,比如Java并不能自动的发现Docker设置的内存限制,CPU限制. 这将导致JVM不能稳定服务 ...

  6. java oop 集合框架

    集合主要是用来存放数据的,集合与数组的主要区别在于,集合的大小不受限制,而数组的大小受限制,在使用集合增加数据时又常常与泛型联系起来,所以集合和泛型在实际开发过程中总会结合在一起 数组致命的缺点是数组 ...

  7. 【转】/bin/bash^M: bad interpreter: No such file or directory

    执行一个脚本full_build.sh 时, 一直是提示我: -bash: ./full_build.sh: /bin/bash^M: bad interpreter: No such file or ...

  8. mybatis 使用接口绑定

    使用selectList,selectOne..的缺陷 刚开始学习mybatis的时候,使用selectList或者selectOne,传入要调用的mapper,如果又参数要传递的话,就需要将参数进行 ...

  9. Flask WTForms的使用和源码分析 —— (7)

    Flask-WTF是简化了WTForms操作的一个第三方库.WTForms表单的两个主要功能是验证用户提交数据的合法性以及渲染模板.还有其它一些功能:CSRF保护, 文件上传等.安装方法: pip3 ...

  10. Java JPA @Transient 在Hibernate中应用

    jpa @Transient - 走过程序员的路 - CSDN博客https://blog.csdn.net/lafengwnagzi/article/details/55511066 Hiberna ...