vuex2中使用mapGetters/mapActions报错的解决方法
解决方案
可以安装整个stage2的预置器或者安装 Object Rest Operator 的babel插件 babel-plugin-transform-object-rest-spread
。
接着在babel的配置文件 .babelrc 中应用插件:
{ "presets": [ ["es2015", { "modules": false }] ], "plugins": ["transform-object-rest-spread"] } // { "presets": [ ["env", { "modules": false, "targets": { "browsers": ["> 1%", "last 2 versions", "not ie <= 8"] } }], "stage-2" ], "plugins": ["transform-vue-jsx", "transform-runtime"] }
重启webpack,就不会再有报错了。
总结
以上所述是小编给大家介绍的vuex2中使用mapGetters/mapActions报错的解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!
相关推荐
-
Vue唯一可以更改vuex实例中state数据状态的属性对象Mutation的讲解
更改 Vuex 的 store 中的状态的唯一方法是提交 mutation. Vuex 中的 mutation 非常类似于事件: 每个 mutation 都有一个字符串的 事件类型 (type) 和 一个 回调函数 (handler).这个回调函数就是我们实际进行状态更改的地方,并且它会接受 state 作为第一个参数.mutation 必须是同步函数. 不带载荷(只改变数据的状态) 接前面几篇文章的例子,这里我们修改商品价格减半. store.js mutations: { //商品价格减半:
-
Vue核心概念Action的总结
Action 类似于mutation,不同在于: - Action 提交的是mutation,而不是直接变更状态. - Action 可以包含任意异步操作. Action 函数接受一个与 store 实例具有相同方法和属性的 context 对象,因此你可以调用 context.commit 提交一个 mutation,或者通过 context.state 和 context.getters 来获取 state 和 getters.当我们在之后介绍到 Modules 时,你就知道 context
-
谈谈因Vue.js引发关于getter和setter的思考
起因 当我打印出Vue实例下的data对象里的属性时,发现了一个有趣的事情: 它的每个属性都有两个相对应的get和set方法,我觉的这是多此一举的,于是去网上查了查Vue双向绑定的实现原理,才发现它和Angular.js双向绑定的实现原理完全不同,Angular是用的数据脏检测,当Model发生变化,会检测所有视图是否绑定了相关数据,再更改视图.而Vue使用的发布订阅模式,是点对点的绑定数据. Vue的数据绑定只有两个步骤,compile=>link. 我一直在想,vue是通过什么去监听用户对M
-
Vue核心概念Getter的使用方法
有时候我们需要从store中的state中派生出一些状态. 如果有多个组件需要用到此属性,我们要么复制这个函数,或者抽取到一个共享函数然后在多处导入它--无论哪种方式都不是很理想. Vuex 允许我们在store中定义getter属性(可以认为是 store 的计算属性).就像计算属性一样,getter 的返回值会根据它的依赖被缓存起来,且只有当它的依赖值发生了改变才会被重新计算. 比如这里我们在Page4.vue里面需要对商品价格加倍,我们就可以使用Getter. 使用Getter store
-
Vuex之理解Getters的用法实例
1.什么是getters 在介绍state中我们了解到,在Store仓库里,state就是用来存放数据,若是对数据进行处理输出,比如数据要过滤,一般我们可以写到computed中.但是如果很多组件都使用这个过滤后的数据,比如饼状图组件和曲线图组件,我们是否可以把这个数据抽提出来共享?这就是getters存在的意义.我们可以认为,[getters]是store的计算属性. 2.如何使用 定义:我们可以在store中定义getters,第一个参数是state const getters = {sty
-
如何为vuex实现带参数的 getter和state.commit
getter 带参数 参考: https://vuex.vuejs.org/guide/getters.html#method-style-access 或者: https://stackoverflow.com/questions/37763828/javascript-es6-double-arrow-functions 官方例子: getters: { // ... getTodoById: (state) => (id) => { return state.todos.find(tod
-
vuex中的 mapState,mapGetters,mapActions,mapMutations 的使用
一.介绍 vuex里面的四大金刚:State, Mutations,Actions,Getters (上次记得关于vuex笔记 http://www.jb51.net/article/138229.htm,是一个简单的应用:这是一些简单的vue的小组件方法: http://www.jb51.net/article/138230.htm) 何为四大金刚? 1.State (这里可以是 小写的 state,跟官网保持一致,采用大写,因为个人习惯,后面的代码介绍采用小写) vuex的状态管理,需要依赖
-
详解vuex中mapState,mapGetters,mapMutations,mapActions的作用
在开始接触vuex框架的时候对那些state,action,mutation,getter等理解的还挺顺利的,然后突然出来一种加了一个前缀的mapState等,这样的就有点蒙圈了...特别是官方的文档并没有给除详细的说明跟例子...然后就自己慢慢理解了一下.其实也就是一个重命名而已...以下就是例子,希望能帮助理解: 在store中代码 import Vuex from 'vuex' import Vue from 'vue' Vue.use(Vuex); const store = new V
-
vue.js的双向数据绑定Object.defineProperty方法的神奇之处
vue.js 2.0版的双向数据绑定就是通过Object.defineProperty方法实现的,俗称属性拦截器. 这么说吧,vue.js是通过它实现双向绑定的.俗称属性拦截器.而且专门用来监控对象属性变化的Object.observe方法也被草案发起人撤回了(此方法在node环境中仍能使用).可见defineProperty的威力之大. Object.defineProperty() 不支持ie8 方法会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象. //
-
解决mpvue + vuex 开发微信小程序vuex辅助函数mapState、mapGetters不可用问题
前言 最近博主正在用微信小程序开发一款网上商城系统.恰好赶上了美团开源的小程序开发框架mpvue.该框架继承了vue.js的特性,用起来还是蛮爽的.然后在开发中,数据仓库这块懵逼了, 引入的vuex的辅助函数mapState.mapGetters.mapMutations.mapActions等怎么就不能用呢.苦恼之际打开D盘,一番愉悦之后,终于想通啦- 问题分析 •vuex辅助函数 首先简单说一下vuex的辅助函数mapState.mapGetters.mapMutations.mapActi
随机推荐
- 浅谈数据库事务四大特性
- Ext修改GridPanel数据和字体颜色、css属性等
- 会员下线加积分,实现原理分享(有时间限制)
- 利用正则表达式提取固定字符之间的字符串
- linux 用户和组命令整理及详细介绍
- spring mvc中的@PathVariable获得请求url中的动态参数
- Json按某个键的值进行排序
- Yii框架防止sql注入,xss攻击与csrf攻击的方法
- 图文详解WinPE下安装Python
- 快速解决js中window.location.href不工作的问题
- 介绍Python中内置的itertools模块
- C#算法函数:获取一个字符串中的最大长度的数字
- javascript实现跨域的方法汇总
- VBS教程:运算符-运算符概述
- 详解JavaScript UTC时间转换方法
- Enter转换为Tab的小例子(兼容IE,Firefox)
- DeDecms实现更漂亮整齐的缩略图
- 详细介绍Java内存泄露原因
- ecshop 2.72如何修改后台访问地址
- Python编程argparse入门浅析