Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/25.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Reactjs React Redux工具包:没有为键提供减速机;myReducer“;将存储导入到单独的文件时_Reactjs_Redux_Redux Toolkit - Fatal编程技术网

Reactjs React Redux工具包:没有为键提供减速机;myReducer“;将存储导入到单独的文件时

Reactjs React Redux工具包:没有为键提供减速机;myReducer“;将存储导入到单独的文件时,reactjs,redux,redux-toolkit,Reactjs,Redux,Redux Toolkit,我正在尝试对react组件之外的某个事件分派redux操作。但是,当我在包含此事件处理程序的单独js文件中从“../../app/store”导入存储时,我在组件中遇到以下错误: // ... const mapStateToProps = state => ({ some_prop: state.myReducer.some_prop }) // ... 键“myReducer”未提供减速机 我的文件: store.js: import { configureStore } f

我正在尝试对react组件之外的某个事件分派redux操作。但是,当我在包含此事件处理程序的单独js文件中从“../../app/store”导入存储时,我在组件中遇到以下错误:

// ...
const mapStateToProps = state => ({
    some_prop: state.myReducer.some_prop
})
// ...
键“myReducer”未提供减速机

我的文件:

store.js:

import { configureStore } from '@reduxjs/toolkit';
// ...
import rootReducer from './rootReducer'

const middleware = //...

const store = configureStore({
  reducer: rootReducer,
  middleware
});

export default store;
减根剂:

import { combineReducers } from 'redux';

// reducers created with createSlice and exported like this: export default SomeFeatureSlice.reducer;
import myReducer from '../features/my/mySlice' 
import SomeFeatureReducer from '../features/some_feature/SomeFeatureSlice'


const rootReducer = combineReducers({
    //...
    myReducer,
    SomeFeatureReducer
});

export default rootReducer;
组成部分:

// ...
const mapStateToProps = state => ({
    some_prop: state.myReducer.some_prop
})
// ...
处理程序:

// ...
import store from '../../app/store'
// an action exported this way: export const { myAction } = SomeFeatureSlice.actions;
import { myAction } from '../../features/some_feature/SomeFeatureSlice'
//...
store.dispatch(myAction());
//...
index.js:

import store from './app/store';
// ...

ReactDOM.render(
  <React.Fragment> 
    <Provider store={store}>
      <App />
    </Provider>
  </React.Fragment>,
  document.getElementById('root')
);
从“/app/store”导入存储;
// ...
ReactDOM.render(
,
document.getElementById('root'))
);
当我从处理程序中删除
importstore
语句时,一切正常。我做错了什么?

我不确定“handler.js”文件在你的应用程序中的位置

然而:

  • 有可能是您创建的,这将破坏一些东西,因为在设置存储时其中一个文件不会被初始化

如果在远程API调用中发生错误,我的处理程序基本上会捕获错误,并打算更新存储区中指示应呈现错误页面的标志。我可以在所有切片中捕获此异常,然后将此操作分派到
SomeFeatureSlice
,但这是代码重复,我不太确定如何以另一种方式解决此问题…尝试将其编写为thunk并分派,而不是将其编写为需要导入存储的独立函数。