首页 > 其他分享 >vuex.esm.js:135 Uncaught Error: [vuex] getters should be function but “getters.mode“ in module “

vuex.esm.js:135 Uncaught Error: [vuex] getters should be function but “getters.mode“ in module “

时间:2024-03-29 17:31:10浏览次数:33  
标签:function vuex getters js state sideMode import Vuex

报错vuex.esm.js:135 Uncaught Error: [vuex] getters should be function but "getters.mode" in module "userModule" is "dark". at assert (vuex.esm.js:135:1)

原因:在使用vuex的moulds时 index.js中已创建了一个vue实例new Vuex.Store,在模块文件中又再创建了一个,导致报错。

src\store\index.js

import Vue from 'vue';
import Vuex from 'vuex';
import user from './modules/user';	// 引入store的其余js组件

Vue.use(Vuex);

// 创建并暴露store
export default new Vuex.Store({
	modules:{
		userModule: user, // 定义在vue调用时候的调用名
	}
});,
})

src\store\modules\user.js

// import Vue from 'vue';
// import Vuex from 'vuex';

// Vue.use(Vuex);

// export default new Vuex.Store ({

export default ({ // 直接抛出对象,写成export default new Vuex.Store会报错,以上无用的引用可去掉
  state: {
    userInfo: {
      uuid: '',
      sideMode: 'dark',
    },
  },
  getters:{
    mode(state) {
      return state.userInfo.sideMode;
    },
  },
  mutations: {
    SET_SIDE_MODE(state, sideMode) {;
      state.userInfo.sideMode = sideMode;
    }
  },
  actions: {},
  modules: {}
});

标签:function,vuex,getters,js,state,sideMode,import,Vuex
From: https://blog.csdn.net/WDY66886688/article/details/137151468

相关文章

  • 在Vue项目中使用Vuex进行状态管理是一种常见做法。下面是一个简单的示例,展示了如何创
    步骤1:创建VuexStore首先,你需要创建一个Vuexstore。通常,这是在你的项目的store目录下完成的。//store.jsimportVuefrom'vue';importVuexfrom'vuex';Vue.use(Vuex);conststore=newVuex.Store({state:{count:0},mutations:{increment(......
  • 【平台开发】MTK6833——add harware command queue function in lk
    CQE实现主要步骤(参考协议)Hostsystem结构commandqueue任务结构:2.TheoryofOperation(操作理论)init(初始化)初始化,enableCQ配置CQCFGTaskDescriptorsize配置CQTDLBA(CommandQueuingTaskDescriptorListBaseAddress)和CQTDLBAU(CommandQueuingTaskDe......
  • How to use the smb function of Babyfile App (connect Mac computer)
    1.Mac computer "SystemSettings"->"General"->"Sharing" reachthepagebelow(ordirectlysearchfor"FileSharing"onthesystemsettingspagetoreachthepage).Thenclickthebuttonshownin①2.Then......
  • Z_Function
    defz_func(s:str)->list:n=len(s)z=[0]*(n)l,r=0,0foriinrange(1,n):ifi<r:z[i]=min(r-i,z[i-l])whilei+z[i]<nands[z[i]]==s[i+z[i]]:z[i]+=1ifi+z[i]......
  • Vue学习笔记60--mapState + mapGetters
    示例一:通过计算属性src/store/index.js //该文件用于创建vuex中最为核心的store//引入VueimportVuefrom'vue'//引入vueximportVuexfrom'vuex'//使用插件Vue.use(Vuex)/*准备actions--用于相应组件中的动作1.context--miniStore2.actions:建议逻辑处理在......
  • Flink 流数据处理 基于Flink1.12.0版本 MapFunction 只适用于一对一的转换,而 FlatMap
    Flink流数据处理基于Flink1.12.0版本MapFunction只适用于一对一的转换,而FlatMapFunction中可以一对多,或者多对一序言基于官网教程整理的一个教程。基于Flink1.12.0版本。目前该版本的Flink支持的source与sink如下所示参考资料:https://ci.apache.org/projects/flink......
  • Flink: Function And Rich Function , 对比 Function ,Rich functions还提供了这些方法:o
    Flink:FunctionAndRichFunction,对比Function,Richfunctions还提供了这些方法:open、close、getRuntimeContext和setRuntimeContext序言    了解了Flink提供的算子,那我们就可以自定义算子了.自定义算子的目的是为了更加灵活的处理我们的业务数据,并将满足条件......
  • Flink API的四层抽象级别是什么?能用实际项目案例讲解一下吗? Flink API的四层抽象级别
    FlinkAPI的四层抽象级别是什么?能用实际项目案例讲解一下吗?首先,FlinkAPI的四层抽象级别是指:最底层抽象:ProcessFunctionAPI、核心API:DataStreamAPI、TableAPI、SQL。这四个抽象级别可以比作烹饪中的不同方式,从简单的速食制作到复杂的大餐烹饪。1.最底层抽象:ProcessFunctionAP......
  • Vue学习笔记59--store(getters + )
    store(getters) 示例一:Count.vue<template><div><h3>当前求和为:{{$store.state.sum}}</h3><h3>当前求和*10为:{{$store.getters.bigSum}}</h3><!--<selectv-model="selectNo"><option:va......
  • Vue学习笔记58--vuex
    vuex专门在Vue中实现集中式状态(数据)管理的一个Vue插件,对Vue应用中多个组件的共享状态进行集中式的管理(读/写),也是一种组件间通信的方式,且适用于任意组件间通信。Github地址:https://github.com/vuejs/vuex什么时候使用Vuex多个组件依赖于同一状态来自不同组件的行为需要......