我正在学习redux工具包,不幸的是,我遇到了像Type Error这样的错误,但我没有做出解决方案.

创建计数器切片

const { createSlice } = require("@reduxjs/toolkit");

const initialState = {
  count: 0,
};
const counterSlice = createSlice({
  name: "counter",
  initialState,
  reducers: {
    increment: (state, action) => state.count++,
    decrement: (state, action) => state.count--,
  },
});
module.exports = counterSlice.reducer;
module.exports.counterActions = counterSlice.reducer;

配置Redux Store

const { configureStore } = require("@reduxjs/toolkit");
const counterReducer = require("../features/counter/counterSlice");

// Configure Store
const store = configureStore({
  reducer: {
    counter: counterReducer,
  },
});

module.exports = store;

派送Redux Store

const store = require("./src/rtk/store/store");
const counterActions = require("./src/rtk/features/counter/counterSlice");

console.log(store.getState());

// subscribe to state chnages
store.subscribe(() => {
  console.log(store.getState());
});

// dispatch Actions
store.dispatch(counterActions.increment());
store.dispatch(counterActions.decrement());

我面对的错误大约是TypeError: counterActions.increment is not a function,如下所示,

[nodemon] restarting due to changes...                                                     
[nodemon] starting `node app.js`
{ counter: { count: 0 } }
/media/imdad/Programming/MERN/Redux/Redux-Toolkit/rtkBasicSetup/app.js:12
store.dispatch(counterActions.increment());
                              ^

TypeError: counterActions.increment is not a function
    at Object.<anonymous> (/media/imdad/Programming/MERN/Redux/Redux-Toolkit/rtkBasicSetup/app.js:12:31)
    at Module._compile (node:internal/modules/cjs/loader:1256:14)
    at Module._extensions..js (node:internal/modules/cjs/loader:1310:10)
    at Module.load (node:internal/modules/cjs/loader:1119:32)
    at Module._load (node:internal/modules/cjs/loader:960:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)
    at node:internal/main/run_main_module:23:47

Node.js v18.17.0

Can anyone please help me to solve this issue? The error is also given in the attached file please check it. Error and Code

推荐答案

看起来您实际上没有正确地导出这counterSlice个操作.

module.exports.counterActions = counterSlice.reducer;

应该是

module.exports.counterActions = counterSlice.actions;

我对模块出口不是很熟悉,但我认为counterActions个也是错误的进口.

const counterActions = require("./src/rtk/features/counter/counterSlice");

可能是should美元.

const { counterActions } = require("./src/rtk/features/counter/counterSlice");

现在,counterActions.increment应该是对状态片中声明的increment操作/减少器的引用.

Javascript相关问答推荐

React中的表格中 Select Radio按钮

如何在pixi js中画一条简单的线

如何在Jest中调用setupFile下列出的文件所需的函数?

我应该如何在此Angular 16应用程序中的方法中使用@ Hostspel?

订阅操作顺序

Next.js Next/Image图像隐含性有任何类型-如何修复?

React:未调用useState变量在调试器的事件处理程序中不可用

是什么原因导致此Angular 16应用程序中类型错误时属性结果不存在?

窗口.getComputedStyle()在MutationObserver中不起作用

jQuery提交按钮重新加载页面,即使在WordPress中使用preventDefault()

使用javascript将Plotly Expandable Sparkline转换为HighCharter Plot在bslib卡中

在vercel throws上部署带有gunjs的sveltekit应用无法找到模块./' lib/文本编码'

引用在HTMLAttributes<;HTMLDivElement>;中不可用

Ember.js 5.4更新会话存储时如何更新组件变量

我正在建立一个基于文本的游戏在react ,我是从JS转换.我怎样才能使变量变呢?

JS:XML insertBefore插入元素

如何在使用rhandsontable生成表时扩展数字输入验证?

第三方包不需要NODE_MODULES文件夹就可以工作吗?

令牌JWT未过期

AddEventListner,按键事件不工作