vuex 命名空间
默认情况下,模块内部的action mutation getter是注册在全局命名空间的,如果希望你的模块具有更高的封装度和复用性,你可以通过添加namespaced:true的方式使其成为带命名空间的模块。当模块注册后,它的所有getter action 以及mutation都会自动根据模块注册的路径调整命名。
export default moduleA={
namespaced:true
}
带命名空间的绑定函数
computed:{
...mapstate({
a:state=>state.namespace.a
});
}
也可以将模块的空间名称字符串作为第一个参数传递给上述的函数,这样所有的绑定就会自动将该模块作为上下文,
computed:{
...mapstate(namespace,{
a:state=>state.a
});
}
也可以通过createNamespaceHelpers 创建基于某个命名空间辅助函数。它返回一个对象,对象里有新的绑定在给定命名空间的组件绑定的辅助函数:
import {createNamespaceHelpers} from ‘vuex’
const {mapstate}=createNamespaceHelplers(namespace);
computed:{
...mapstate({
a:state=>state.a
});
}
vuex 命名空间的更多相关文章
- Veux mapState、mapGetters、mapActions、mapMutations && Vuex命名空间
1 # 一.四个map方法的使用 2 # 1.mapState方法:用于帮助我们映射state中的数据为计算属性 3 computed:{ 4 // sum(){ 5 // return this.$ ...
- vue3.0+vite+ts项目搭建--基础配置(二)
集成vue-router 使用yarn yarn add vue-router@next --save 安装完成之后在src目录下创建文件夹router/index.ts,创建完成之后需要在Vue-R ...
- 一个简单的实例演示vuex模块化和命名空间
因为Vuex Store是全局注册的,不利于较大的项目,引入模块分离业务状态和方法,引入命名空间解决不同模块内(getters,mutaions,actions)名称冲突的问题 ----------- ...
- Vuex模块:开启命名空间
模块开启命名空间后,享有独自的命名空间. { "模块1":{ state:{}, getters:{}, mutations:{}, actions:{} }, "模块2 ...
- Vuex模块:不开启命名空间
模块不开启命名空间时,会共享全局命名空间. { state: { 模块1: "局部状态1", 模块2: "局部状态2" }, getters: { getter ...
- 关于Vue.js 2.0 的 Vuex 2.0,你需要更新的知识库
应用结构 实际上,Vuex 在怎么组织你的代码结构上面没有任何限制,相反,它强制规定了一系列高级的原则: 应用级的状态集中放在 store 中. 改变状态的唯一方式是提交mutations,这是个同步 ...
- vuex 笔记
Vuex 笔记 一个简单的状态管理 单一数据源: const sourceOfTruth = {} const vmA = new Vue({ data: sourceOfTruth }) const ...
- vuex 模块
今天,在我编写系统中一个模块功能的时候,由于我使用vuex存储数据的状态,并分模块存储.我是这样在存储文件中定义state,getters,actions,mutations的,我打算在不同模块文件都 ...
- 初识vuex
1.简介 vuex是 vue官方推荐的一个状态管理器.当我们遇到很多状态改变时,组件之间的通信就会变得复杂,这时候vuex的强大就展现出来. 我们从vuex的原理以及vuex的api两个部分介绍vue ...
随机推荐
- visual c++ 2013进行MySQL编程(ODBC) -- (一) 套装安装
最近写了有些技术类文章了,只因为最近研究多了些东西,有一些项目用到了,所以自己记录一下,怕自己忘记,如果有哪位同学有自己的见解,可以邮件或者回复,技术类的探讨,不管对否,都是欢迎的. 操作之前,必须安 ...
- python(4)- 简单练习:python实现购物车的优化
购物车程序优化题目要求: 1. 用户退出时打印商品列表时,按以下格式 -------您购买的商品如下------ id 商品 数量 单价 总价 1 iPhone 2 ...
- Spring.net1.3.1+Nhibernate3.0+Mysql/Access/SqlServer/Oracel/SQlite
详情请看我的博文:http://www.ruisoftcn.com/blog/article.asp?id=999
- vs 编译错误 The name 'InitializeComponent' does not exist in the current context in WPF application
1:文件命名空间的问题 xaml文件和model.cs文件的命名空间 2:csproj 那么它究竟是给谁用的呢?那是给开发工具用的,例如我们在熟悉不过的Visual Studio,以及大家可以没有接触 ...
- 关联查询left join中on 和where 的区别
关于 “A LEFT JOIN B ON 条件表达式” 的一点提醒 ON 条件(“A LEFT JOIN B ON 条件表达式”中的ON)用来决定如何从 B 表中检索数据行. 如果 B 表中没有任何一 ...
- 后端程序员看前端想死(二)进入页面之后js分析
在上一篇中分析了一下以网页的组成.header中引入的乱七八糟的东西,现在进入到js中进行分析了 tuhooo啊,你是要搞前端了么? nonono,好玩,学一下 打开页面之后执行js的几种方法 直接写 ...
- 2017-07-19-CR 和 LF
CR 和 LF CR - Carriage Return 回车 LF - Line Feed 换行 Carriage 打字机滑轨.老式打字机,打字时,滑轨从左往右移动,一行打完了,需要把滑轨调回到最左 ...
- MAC如何查看某个端口的占用情况
执行如下命令: lsof -i tcp:8080 #8080为查询的端口号 会展示该端口的使用情况,然后kill -9 PID的值即可关闭该端口
- linux的DNS相关介绍(转载)
1.DNS配置文件 /etc/hosts 这个是最早的 hostname 对应 IP 的档案: /etc/resolv.conf :这个重要!就是 ISP 的 DNS 服务器 IP 记录处: /e ...
- 封装EF code first用存储过程的分页方法
一年半没有做过MVC的项目了,还是很怀念(因为现在项目还是原来的ASPX),个人还是喜欢mvc,最近又开始重拾MVC,感觉既熟悉又陌生. 记录一下封装好的分页代码 首先先说下 我使用EF codefi ...