在组件中提交Mutations:

import { mapState, mapMutations } from 'vuex'
export default {
data() {
return {
msg: "vuex要点"
}
},
store,
computed: mapState([
'count'
]),
// methods: mapMutations([
// 'add', 'reduce'
// ]), //或者
methods: {
//如果组件中事件的名称和mutations中方法的名称相同,可以传一个字符串数组
...mapMutations([
'add' //映射 this.add() 为 this.$store.commit('add')
]),
//组件中的事件名和mutations中的方法名不一样,传入对象
...mapMutations({
reduces: 'reduce' //映射 $this.reduces 为 this.store.commit('reduce')
})
}
}

Mutations必须是同步函数!!!

关于mapState和mapMutations和mapGetters 和mapActions辅助函数的用法及作用(二)-----mapMutations的更多相关文章

  1. 关于mapState和mapMutations和mapGetters 和mapActions辅助函数的用法及作用(四)-----mapActions

    介绍mapActions辅助函数: Action提交的是Mutation,不能够直接修改state中的状态,而Mutations是可以直接修改state中状态的:Action是支持异步操作的,而Mut ...

  2. 关于mapState和mapMutations和mapGetters 和mapActions辅助函数的用法及作用(三)-----mapGetters

    简单的理解: const getters = { newCount: function(state){ return state.count += 5; } } ------------------- ...

  3. 关于mapState和mapMutations和mapGetters 和mapActions辅助函数的用法及作用(一)-----mapState

    一.通过mapState函数的对象参数来赋值: <p>{{ count }}</p> <p>{{ count1 }}</p> <p>{{ c ...

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

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

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

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

  6. Veux mapState、mapGetters、mapActions、mapMutations && Vuex命名空间

    1 # 一.四个map方法的使用 2 # 1.mapState方法:用于帮助我们映射state中的数据为计算属性 3 computed:{ 4 // sum(){ 5 // return this.$ ...

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

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

  8. vuex状态管理demo

    vuex状态管理主要包含四个概念  mapState,mapMutations,mapGetters,mapActions. 编写vuex文件夹下面的store.js import Vue from ...

  9. vue使用--vuex快速学习与使用

    什么是vuex? Vuex核心概念 Vuex安装与使用 1.安装 2.目录结构与vuex引入 3.store中变量的定义.管理.派生(getter) 4.vuex辅助函数的使用说明 Vuex刷新数据丢 ...

随机推荐

  1. bzoj1486【HNOI2009】最小圈

    1486: [HNOI2009]最小圈 Time Limit: 10 Sec  Memory Limit: 64 MB Submit: 1778  Solved: 827 [Submit][Statu ...

  2. centos7下tomcat7 或tomcat8启动超慢原因

    1,找到你的jdk安装的位置 ${JAVA_HOME}/jre/lib/security/java.security 2,vi 打开后找到 securerandom.source=file:/dev/ ...

  3. Android沉浸式状态栏(透明状态栏)最佳实现

    Android沉浸式状态栏(透明状态栏)最佳实现 在Android4.4之前,我们的应用没法改变手机的状态栏颜色,当我们打开应用时,会出现上图中左侧的画面,在屏幕的顶部有一条黑色的状态栏,和应用的风格 ...

  4. poj-1655 Balancing Act(树的重心+树形dp)

    题目链接: Balancing Act Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 11845   Accepted: 4 ...

  5. Ubuntu redmine 安装

    /******************************************************************** * Ubuntu redmine 安装 * 说明: * 随着 ...

  6. 【HAOI 2006】 受欢迎的牛

    [题目链接] 点击打开链接 [算法] 先用tarjan缩点,然后找出度为零的点,即可 [代码] #include<bits/stdc++.h> using namespace std; # ...

  7. [转]如何用git将项目代码上传到github

    注册账户以及创建仓库 要想使用github第一步当然是注册github账号了.之后就可以创建仓库了(免费用户只能建公共仓库),Create a New Repository,填好名称后Create,之 ...

  8. ExtJS 4 MVC Viewport和card布局

    http://ext4all.com/post/a-little-bit-strange-navigation 效果图:  app/view/Viewport.js Ext.define('App.v ...

  9. 在selenium中一些相对常用的JavaScript事件

    输入框输入: 1.找到输入框的id,然后进行输入操作 ordinal :输入框的id parameter :需要输入的内容 browser.execute_script("document. ...

  10. 51nod 1119 机器人走方格 V2 【组合数学】

    挺水的但是我好久没写组合数了- 用这样一个思想,在1~m列中,考虑每一列上升几格,相当于把n-1个苹果放进m个篮子里,可以为空,问有几种方案. 这个就是一个组合数学经典问题了,考虑n个苹果放进m个篮子 ...