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. IO 模型 IO 多路复用

    IO 模型 IO 多路复用 IO多路复用:模型(解决问题的方案) 同步:一个任务提交以后,等待任务执行结束,才能继续下一个任务 异步:不需要等待任务执行结束, 阻塞:IO阻塞,程序卡住了 非阻塞:不阻 ...

  2. Linux 常用指令整理

    1. 查看端口占用情况 netstat -tunlp 2.压缩文件 文件夹 tar -cf 文件名.tar 文件夹 gzip 文件名.tar 文件 tar 文件名 文件1 文件2 ... gzip t ...

  3. html5 contenteditable 实现table可编辑(网页版EXCEL)

    一直想找一个免费的网页版的EXCEL插件,以便于多人共同在线编辑,始终没发现合适的. 其实自己实现类似功能也不难.参考:https://blog.csdn.net/chadcao/article/de ...

  4. session和application内置对象

    一.Session内置对象 分析得知request内置对象中的属性只是在当次请求中有效,经过客户端跳转之后就无效,因为客户端跳转属于第二个请求,也就是说request只代表当次请求的对象,如果要让客户 ...

  5. ORM杂记

    1.反射练习 import sys class Person(object): def __init__(self, name): self.name = name def eat(self, foo ...

  6. 厚着脸皮求领导写了一篇java小白进阶大牛之路!!!

    缘起&应朋友之邀 2019年已经过去两个月了,应朋友之邀,写写自己的个人经历,与其说经历还不如是自我的总结与反思.2012年2月份只身一人拖着行李箱来到北京库巴科技有限公司实习,那时候库巴处在 ...

  7. Framework7 索引列表插件的异步加载实现

    前言 Framework7 作为移动端的开发框架的优良之处已经无需多言.现在已经有了 React 和 Vue 版本,之前在项目中用过 F7 + vue 的开发方式,无论是效率还是产出都近乎完美.有时间 ...

  8. 7年,OpenStack从入门到放弃|送书

    七年之痒这个词,大家经常说,不过起源,估计就不是谁都清楚.这是梦露的一部影片的名字,后来大家发现无论是企业,家庭,甚至政府,都在第七年时间段上面临各种麻烦. OpenStack存在的问题,其实已经不是 ...

  9. 故障公告:docker swarm集群“群龙无首”造成部分站点无法访问

    今天傍晚 17:38-18:18 左右,由于 docker swarm 集群出现 "The swarm does not have a leader" 问题,造成博问.闪存.园子. ...

  10. zsh : command not found pip3 的解决方案

    问题描述 在 zsh 中执行 pip xxx ,出现错误 zsh: command not found: pip3 . 当然我很确定自己是有安装 pip3 的,应该是应该切换了shell,导致环境变量 ...