vuex的使用之mapGetters 要去看vuex文档或视频
vuex的使用之mapGetters 要去看vuex文档 30岁之前很多东西要学。
会做梦的辣条鱼
于 2021-05-10 14:58:51 发布
3443
收藏 4
分类专栏: 移动端 Vue 文章标签: vue vuex mapGetters uniapp 传参
版权
移动端
同时被 2 个专栏收录
11 篇文章0 订阅
订阅专栏
Vue
21 篇文章0 订阅
订阅专栏
vue项目中,经常会使用到vuex,vuex是vue的一个状态管理。
本文简单总结一下:vuex中mapGetters的使用。
如果一个变量或对象需要在多个页面和组件中使用,那么,可以使用mapGetters。
一.vuex中声明变量个方法
1.在state中声明:
state: {
freeShipping:cookie.get('freeShipping'),
}
1
2
3
2.在mutations中书写方法:
mutations: {
updatefreeShipping(state, freeShipping) {
state.freeShipping =freeShipping;
},
}
1
2
3
4
5
6
7
3.在getters中书写:
getters: {
freeShipping: state => state.freeShipping || {}
}
1
2
3
4
5
二.在各页面中使用
1,引入
import { mapGetters } from "vuex";
1
2,在method同级上放入computed
computed: mapGetters(["freeShipping"]),
1
或
computed: {
...mapGetters(["freeShipping"])
} ,
1
2
3
可放入多个对象
computed: mapGetters(["userInfo","freeShipping"]),
1
3,页面变量取用
{{freeShipping.value}}
————————————————
版权声明:本文为CSDN博主「会做梦的辣条鱼」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/weixin_44794123/article/details/116595997
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 25岁的心里话
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 按钮权限的设计及实现