这是我的应用store Reaction Redux When Using TypeScrip:

import { configureStore } from '@reduxjs/toolkit';
import rootReducer from '../reducer/combineReducer';
import { createLogger } from 'redux-logger';
import thunk from 'redux-thunk';

const logger = createLogger(); 
const initialState = {
    
};

const store = configureStore({
    reducer: rootReducer,
    middleware: [logger, thunk],
    devTools: process.env.NODE_ENV !== 'production',
    preloadedState: initialState
});

export default store;

现在,我想在preloadedState中给出一些初始全局数据 struct ,然后调整InitialState代码,如下所示:

const initialState = {
    user: {}
};

Visual Studio代码显示错误:

Type '{ user: {}; }' is not assignable to type '{ readonly [$CombinedState]?: undefined; user?: { user: any; loginUser: {}; } | { loginUser: any; user: {}; } | undefined; }'.
  Types of property 'user' are incompatible.
    Type '{}' is not assignable to type '{ user: any; loginUser: {}; } | { loginUser: any; user: {}; } | undefined'.ts(2322)
configureStore.d.ts(45, 5): The expected type comes from property 'preloadedState' which is declared here on type 'ConfigureStoreOptions<CombinedState<{ user: { user: any; loginUser: {}; } | { loginUser: any; user: {}; }; }>, any, Middleware<{}, any, Dispatch<AnyAction>>[], [...]>'
(property) ConfigureStoreOptions<CombinedState<{ user: { user: any; loginUser: {}; } | { loginUser: any; user: {}; }; }>, any, Middleware<{}, any, Dispatch<AnyAction>>[], [...]>.preloadedState?: {
    readonly [$CombinedState]?: undefined;
    user?: {
        user: any;
        loginUser: {};
    } | {
        loginUser: any;
        user: {};
    } | undefined;
} | undefined

我应该怎么做才能添加一些初始的全局字段定义?

推荐答案

答案就在错误消息中:

 Type '{}' is not assignable to type '{ user: any; loginUser: {}; } | { loginUser: any; user: {}; } | undefined'

TypeScrip要求值user是一个包含userloginUser字段的对象,但您给出的却是一个空对象.在对象中传递这些参数以修复错误.

ConfigureStoreOptions人中的type definition人也解释了这一点:

/**
 * The initial state, same as Redux's createStore.
 * You may optionally specify it to hydrate the state
 * from the server in universal apps, or to restore a previously serialized
 * user session. If you use `combineReducers()` to produce the root reducer
 * function (either directly or indirectly by passing an object as `reducer`),
 * this must be an object with the same shape as the reducer map keys.
 */
preloadedState?: DeepPartial<S extends any ? S : S>

Reactjs相关问答推荐

无法覆盖MUI工具栏上的左右填充,除非使用!重要

ReferenceError:未在Redux组件中定义窗口

如何在关闭和打开此 Select 输入时应用旋转效果?

REACTJS:在Reaction中根据路由路径更改加载器API URL

是否为Reaction中未使用的组件生成Tailwincss样式?

如何使用react-router-dom保护嵌套在受保护路由中的嵌套路由?

我从 S3 存储桶下载图像时收到错误

列表中的每个子项都应该有一个唯一的keyprops .在react 应用程序中

如何将 MUI X 数据网格单元格方向更改为行级而不是列级?

Chakra UI:如何在选中状态下设置复选框 colored颜色

使用reactrouterdom时显示"对象无效作为React子组件"错误

使用D3.js绘制和展示弦图的右下方象限

docker:来 automorphic 护进程的错误响应:未指定命令.的原因是什么?

DatePicker MUI 如何在日历左侧显示清除文本

使用 React.UseEffect 从 api 获取但我的清理返回不起作用

如何在props 更改时运行自定义挂钩?

react-query、react-hook-form 和表单验证

如何根据数据库中的值设置单选按钮选中? - react

从输入中获取数字时,react 计数器不会增加

Material UI 安装和 React v. 18.2 出现问题