vuex 分模块后使用mapActions调用action老是提示 [vuex] unknown action type:*** 异常

目录

index.js是这样的

	import Vue from 'vue'
import Vuex from 'vuex'
import getters from './getters' Vue.use(Vuex) const modulesFiles = require.context('./modules', true, /\.js$/) const modules = modulesFiles.keys().reduce((modules, modulePath) => {
const moduleName = modulePath.replace(/^\.\/(.*)\.\w+$/, '$1')
const value = modulesFiles(modulePath)
modules[moduleName] = value.default
return modules
}, {}) const store = new Vuex.Store({
modules,
getters
}) export default store

dataManage.js 模块定义是这样的


const state = {
mId: '',
basicId: ''
}
const mutations = {
SET_MID(state, mId) {
state.mId = mId
},
SET_BASIC_ID(state, basicId) {
state.basicId = basicId
}
}
const actions = {
setcachemid({ commit }, mId) {
console.log(mId)
commit('SET_MID', mId)
},
setBasicId({ commit }, basicId) {
commit('SET_BASIC_ID', basicId)
}
}
export default {
namespaced: true,
state,
mutations,
actions
}

页面中调用时

import { mapActions } from 'vuex'
methods: {
...mapActions([
'setcachemid'
]),
transfromPage(row, path) {
this.setcachemid(row.monitorId) // [vuex] unknown action type: setcachemid
}
}



看dataManage.js并没什么错误呀!

纠结,

发现dispatch得使用这种才行

this.$store.dispatch('dataManage/setcachemid', row.monitorId)

看到这个是否明白了些什么!

最后调用代码改改


import { mapActions } from 'vuex'
methods: {
...mapActions({
'cacc': 'dataManage/setcachemid'
}),
transfromPage(row, path) {
this.cacc(row.monitorId)
}
}

ok问题解决,其实也是粗心开

index.js中模块加载modules[moduleName] = value.default 就知道

为根据模块名称为每个modules 加了一个key ,

访问当然也要到改对应的模块名下去找了



【纠错】

后来乘空闲去看了看源码,感觉上面最后一步的操作时错误的



他是允许在多模块时传入namespace参数来指定获取那个模块下的action 的

...mapActions({
'cacc': 'dataManage/setcachemid'
}),

之所以能成功,

关键在于这个normalizeMap

state的定义

在定义state 时将所有其子模块都通过getNestedState绑定到了state 中上

,然在dispatch时就可以通过对应的val 找到

最终正确写法应该是

    ...mapActions('dataManage', {
'cacc': 'setcachemid'
}),

[vuex] unknown action type:***的更多相关文章

  1. vuex2 mapActions 报错 `unknown action type: xxxx`

    export const setBreadCrumb = ({ dispatch }, data) => { dispatch('SET_BREADCRUMB', data) } 当调用的时候报 ...

  2. 解决vuex 状态管理mutations报错为:"[vuex] unknown mutation type: VIWE_NAV"

    报错截图: 我的解决思路: 1.先检查gettes方向获取与actions提交是否畅通,同时专注检查code是否输错. 2.我查了别人多数是""在vuex中没有mutation,有 ...

  3. mint17.3挂载u盘出现错误:mount:unknown filesystem type 'exfat'

    mint17.3挂载u盘出现错误:mount:unknown filesystem type 'exfat' 安装exfat-fuse: sudo apt-get install exfat-fuse

  4. mount: unknown filesystem type 'ntfs'

    mount: unknown filesystem type 'ntfs' 问题描述 # mount –t ntfs /dev/sdc1 /mnt/usb2 mount: unknown filesy ...

  5. 在linux终端执行clear或top命令时出现:'xterm' unknown terminal type的错误

    例如: [root@localhost phpmyadmin]# clear 'xterm': unknown terminal type. 解决办法: 1.临时办法,下次启动失效,需要重新执行 ex ...

  6. scp使用加密算法报错unknown cipher type

    为了提高scp的传输速度指定了scp的加密算法为arcfour $ scp -c arcfour localFile userName@remoteIP:remoteFile 得到报错unknown ...

  7. [virsh] error: unknown OS type hvm解决办法

    今天在linux服务器上编译安装升级了下qemu,升级命令如下: root@ubuntu:/opt/qemu-# ./configure --prefix=/usr/local/ --target-l ...

  8. CentOS提示::unknown filesystem type 'ntfs'.解决

    在将硬盘插到Linux系统上,打开硬盘时一直提示:unknown filesystem type 'ntfs'.在尝试网上的方法也遇到了一些问题. 下面按照遇到的问题,按照正确的方式注意操作从而避免问 ...

  9. mount: unknown filesystem type 'LVM2_member'解决方案

    系统启动到request_module: runaway loop modprobe binfmt-464c挂起 利用U盘系统,挂载硬盘出现:mount: unknown filesystem typ ...

  10. 'vt100': unknown terminal type.

    在Linux终端执行clear或top命令时出现:vt100: unknown terminal type的错误 1.临时办法,下次启动失效,需要重新执行 执行以下命令 $ printenv | gr ...

随机推荐

  1. 报错的大怨种来了--java.sql.SQLSyntaxErrorException: You have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '' at line 1

    频繁爆出这样的错误:java.sql.SQLSyntaxErrorException: You have an error in your SQL syntax; check the manual t ...

  2. 4.错误代码C1083

    有的时候在VS中遇到的error C1083: 无法打开**: " * .*": No such file or directory的错误,这里总结了我遇到过的情况: 错误 C10 ...

  3. 自己动手从零写桌面操作系统GrapeOS系列教程——22.文件系统与FAT16

    学习操作系统原理最好的方法是自己写一个简单的操作系统. 新买的硬盘和优盘在第一次使用时需要格式化,有时候还需要分区.这是为什么呢?分区和格式化到底是干啥呢?本讲将为大家解开这些疑惑. 一.文件系统 1 ...

  4. TypeScript 学习总结

    TypeScript JavaScript 语言 面向对象编程语言 面向脚本编程 是否支持可选参数 支持 不支持 是否支持静态类型 支持 不支持 是否支持接口 支持 不支持 TS:是JS的超集,即对J ...

  5. DOM属性节点加其他节点的操作

     节点属性 nodeType 返回值为数值                 节点类型(nodeType)    节点名字(nodeName)    节点值(nodeValue)        元素节点 ...

  6. Ubuntu+uWSGI部署基于Django的API【鸿篇巨制,事无巨细】

    背景 任务: 视频翻译项目需要在两个服务器上进行通信(国内&海外的阿里服务器). 因为python是主语言,选用了Django 来快速部署API. 注:Django中文文档:https://d ...

  7. Spring(Bean详解)

    GoF之工厂模式 GoF是指二十三种设计模式 GoF23种设计模式可分为三大类: 创建型(5个):解决对象创建问题. 单例模式 工厂方法模式 抽象工厂模式 建造者模式 原型模式 结构型(7个):一些类 ...

  8. 一些随笔No.3

    1.开发应以业务为导向,技术只是手段 2.视觉上和程序上不一定是完全符合 比如,我所说的阻塞是视觉层面,或者是对用户而言的阻塞,而不是程序意义上的.我也许会传完参的同时销毁原组件,生成一个看起来一模一 ...

  9. 在Ubuntu中安装Samba文件服务

    点击蓝字 关注我们 First Frost 在Ubuntu中安装Samba文件服务 Samba是一个能让Linux系统应用Microsoft网络通讯协议的软件,而SMB是Server Message ...

  10. devops工具链基建建设评价标准

    之所以写这篇是因为有朋友私下让我完善下基建建设的标准和四个阶梯划分,然后让我一定要把腾讯和百度加到基建建设的排名中(看热闹不嫌事大). 基建infra建设四个考察维度 1)工具链完整性:该有的工具是否 ...