React 本机错误,Redux:在初始化期间返回未定义的键"nav"的切片缩减器



使用React Native制作一个超级克隆,在第一次制作应用程序时设置Redux, Metro捆绑器返回了这些错误:

Error: The slice reducer for key "nav" returned undefined during initialization. If the state passed to the reducer is undefined, you must explicitly return the initial state. The initial state may not be undefined. If you don't want to set a value for this reducer, you can use null instead of undefined.
at node_modulesreact-nativeLibrariesLogBoxLogBox.js:149:8 in registerError
......
Invariant Violation: "main" has not been registered. This can happen if:
* Metro (the local dev server) is run from the wrong folder. Check if Metro is running, stop it and restart it in the current project.
* A module failed to load due to an error and `AppRegistry.registerComponent` wasn't called.
.....

这是App.js

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { Provider } from 'react-redux';
import { store } from './store';
// 1. Set up redux - done
// 
export default function App() {
return (
<Provider store={store}>
<View style={styles.container}>
<Text>Uber</Text>
</View>
</Provider>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: '#fff',
alignItems: 'center',
justifyContent: 'center',
},
});

这是navSlice.js

import { createSlice } from "@reduxjs/toolkit";
const innitialState = {
origin: null,
destination: null,
travelTimeInformation: null,
}
export const navSlice = createSlice({
name:"nav",
innitialState,
reducer: {
setOrigin: (state, action) =>{
state.origin = action.payload;
},
setDestination: (state, action) =>{
state.destination = action.payload;
},
setTravelTimeInformation: (state, action) =>{
state.travelTimeInformation = action.payload;
},

}
});
export const { setOrigin, setDestination, setTravelTimeInformation } = navSlice.actions;
// Selectors
export const selectOrigin = (state) => state.nav.origin;
export const selectDestination = (state) => state.nav.destination;
export const selectTravelTimeInformation = (state) => state.nav.travelTimeInformation;
export default navReducer = navSlice.reducer;

这是Store.js

import { configureStore } from "@reduxjs/toolkit";
import navReducer from "./slices/navSlice";
export const store = configureStore({
reducer: {
nav: navReducer,
},
});

我得到这些错误的原因是什么?我该如何解决这个问题?我如何设置redux有问题吗?

将navslice中的拼写改为reducers并重新启动模拟器

您的initialstate拼写错误。将其改为initialState

最新更新