Vuex store出现8:3 Parsing error: Unexpected keyword 'new'错误如何解决?
报错触发原因
- 核心语法错误:声明
store变量时错误使用对象字面量的{}包裹new Vuex.Store()实例化语句。对象字面量内部要求遵循键名: 键值的语法格式,直接写入new关键字不符合JS对象语法规则,因此触发“Unexpected keyword 'new'”的解析错误。 - 额外语法问题:
new Vuex.Store(...)语句末尾多余的分号;,在对象字面量内部不允许出现分号作为语句结束符。 - 隐藏逻辑错误:把修改state的
increment方法写在了getters配置中,Vuex的getters仅用于声明派生状态的计算方法,不允许修改state,修改state的操作必须放在mutations中声明。
修复步骤
- 把包裹
new Vuex.Store()的对象字面量{}去掉,直接将实例化结果赋值给store变量 - 删除
new Vuex.Store(...)末尾多余的分号 - 将
increment方法从getters移动到mutations配置项中
修复后完整代码
// Vuex store import Vue from 'vue'; import Vuex from 'vuex'; Vue.use(Vuex); export const store = new Vuex.Store({ state: { count: 0, }, mutations: { increment: (state) => { state.count += 1; }, } })
内容的提问来源于stack exchange,提问作者nikoloz gabidzashvili
相关产品推荐
相关产品推荐

