做泰康公众号的项目时候有一个需求创建公众号的时候后台有一个社区id提供给后台展现人员和部门,在群发消息时候也要给后台一个社区id只不过获取社区的id接口和上一个不是一样的,本来在页面中写了两个select,一个是用elementUI的select选择器,另一个是在标签选择器,现在在创建公众号时使用公众号社区的id让群发消息的select隐藏,我是用vuex在state里声明两个变量分别设置falese ,true,这样在引用各个接口时候v-show显示相应的数据,用this.$store.state.属性是可以设置和获取相应的值,但是用mapState属性能获取但是设置不了值,如果设置就会报错,如果设置需要在mutations中来处理。代码如下

state:

export default {
selectAcounts: true, // 创建公众号
selectMassmessag: false // 群发社区
}
mutations:
export default {
updateLoginStatus (state, bool) {
state.isLogin = bool
},
updateselectAcounts (state, bool) {
state.selectAcounts = bool
},
updateselectMassmessag (state, bool) {
state.selectMassmessag = bool
},
}
在组件方法中引入mapMutations
methods:{
...mapMutations(['updateselectAcounts', 'updateselectMassmessag'])
//点击选择按钮时候出发mapMutations中的两个方法改变state中的值 也可以通过this.store.$state.selectAcounts = false和this.$store.state.selectMassmessag = true来重新设置值
showTreeToast (type) {

this.updateselectMassmessag(true)

this.updateselectAcounts(false)
}

}
 

vuex this.$store.state.属性和mapState的属性中的一点点区别的更多相关文章

  1. Vuex之store仓库计算属性Getter

    (1)简介 Getter相当于vue中的computed计算属性,getter 的返回值会根据它的依赖被缓存起来,且只有当它的依赖值发生了改变才会被重新计算,这里可以通过定义vuex的Getter来获 ...

  2. Do not mutate vuex store state outside mutation handlers.

    组件代码: selectItem(item,index) { this.selectPlay({ list: this.songs, index }) }, ...mapActions([ 'sele ...

  3. vuex使用之state访问状态对象

    引入vuex1.利用npm包管理工具,进行安装 vuex.在控制命令行中输入下边的命令就可以了. npm install vuex --save 需要注意的是这里一定要加上 –save,因为你这个包我 ...

  4. Vuex状态数据源state

    (1)单一状态树 Vuex 使用单一状态,用一个对象就包含了全部的应用层级状态.至此它便作为一个“唯一数据源 (SSOT)”而存在.这也意味着,每个应用将仅仅包含一个 store 实例. 单一状态树让 ...

  5. [Vuex系列] - 细说state的几种用法

    state 存放的是一个对象,存放了全部的应用层级的状态,主要是存放我们日常使用的组件之间传递的变量. 我们今天重点讲解下state的几种用法,至于如何从头开始创建Vuex项目,请看我写的第一个文章. ...

  6. 挑战全网最幽默的Vuex系列教程:第二讲 Vuex旗下的State和Getter

    先说两句 上一讲 「Vuex 到底是个什么鬼」,已经完美诠释了 Vuex 的牛逼技能之所在(纯属自嗨).如果把 Vuex 比喻成农药里面的刘备,那就相当于你现在已经知道了刘备他是一个会打枪的力量型英雄 ...

  7. vuex状态管理,state,getters,mutations,actons的简单使用(一)

    之前的文章中讲过,组件之间的通讯我们可以用$children.$parent.$refs.props.data... 但问题来了,假如项目特别大,组件之间的通讯可能会变得十分复杂... 这个时候了我们 ...

  8. 组件之间的通讯:vuex状态管理,state,getters,mutations,actons的简单使用(一)

    之前的文章中讲过,组件之间的通讯我们可以用$children.$parent.$refs.props.data... 但问题来了,假如项目特别大,组件之间的通讯可能会变得十分复杂... 这个时候了我们 ...

  9. 25、vuex改变store中数据

    以登录为例: 1.安装vuex:npm install vuex --save 2.在main.js文件中引入: import store from '@/store/index.js'new Vue ...

随机推荐

  1. malloc 与 free函数详解<转载>

    malloc和free函数详解   本文介绍malloc和free函数的内容. 在C中,对内存的管理是相当重要.下面开始介绍这两个函数: 一.malloc()和free()的基本概念以及基本用法: 1 ...

  2. Unity中 动态加载 Resources.Load()和Asset Bundle 的区别

    版权声明:本文为博主原创文章,未经博主允许不得转载. 初学Unity的过程中,会发现打包发布程序后,unity会自动将场景需要引用到的资源打包到安装包里,没有到的不会跟进去.我们在编辑器里看到的Ass ...

  3. 爬虫神器xpath的用法(四)

    使用xpath多线程爬取百度贴吧内容 #encoing=utf-8 from lxml import etree from multiprocessing.dummy import Pool as T ...

  4. C++函数内存占用

    一个类的对象中是没有关于普通成员函数的指针的slot,只有成员变量还有虚表指针,类的成员函数的代码定义在PE文件的代码区,所以从程序加载时,就已经分配好了内存用于存放这些代码:代码运行时所需要的内存, ...

  5. [原]POJ-1631-Bridging signals-( 水LIS-O(nlogn) -DP)

    题目大意:求最长上升子序列(LIS)长度,序列最大数不超过40000.因为只有上升排列的接口才不相交. 思路:普通的 O(n^2)的做法肯定会超时:因此,dp[ ] 记录长度为 i+1 的子序列中最末 ...

  6. hdu-5686 Problem B(斐波那契数列)

    题目链接: Problem B Time Limit: 2000/1000 MS (Java/Others)     Memory Limit: 65536/65536 K (Java/Others) ...

  7. js获取元素transform参数得出的个人理解

    之前写页面的时候有试过想用js获取某些元素的translate的数值什么的,但是translate又是transform的子样式(勉强说说),理所当然就是先获取transform样式,再读里面的值. ...

  8. Linux C++ 开发简介(包括Linux守护线程)

    阅读目录 简介 操作系统 编辑器 编译器 构建系统 调试 IDE 可执行程序.动态库.静态库 服务 Windows服务简介 创建Windows服务 注册Windows服务 管理Windows服务 Li ...

  9. python--字符串操作(删除,替换)

    示例: 替换字符串开头和结尾处的空格 1. [代码][Python]代码     跳至 [1] [全屏预览] view source print? 01 # -*- coding: utf-8 -*- ...

  10. asp.net core 配置

    ASP.NET Core的配置系统已经和之前版本的ASP.NET有所不同了,之前是依赖于System.Configuration和XML配置文件web.config,现在支持各种格式的配置,比以前灵活 ...