打字稿反应redux，类型{}上不存在属性答案

【问题标题】：Typescript react redux, property does not exist on type {}打字稿反应redux，类型{}上不存在属性
【发布时间】：2020-07-02 01:43:38
【问题描述】：

我正在使用 react redux 和 typescript 创建身份验证流程。我设置了我的注册身份验证状态界面和初始状态

export interface User {
  id: string;
  username: string;
  email: string;
  social: Social;
  userCourses: Course[];
  enrolledCourses: Course[];
}

interface AuthState {
  isAuth: boolean;
  usernamesAndEmails: UsernameAndEmail[] | [];
  currentUser: User | {};
  isLoading: boolean;
  error: object;
}

const signupInitialState: AuthState = {
  isAuth: false,
  usernamesAndEmails: [],
  currentUser: {},
  isLoading: false,
  error: {},
};

然后我有一个组件，我需要使用 currentUser 状态让用户创建他们的用户名（如果他们使用 google/facebook 注册）。

const { currentUser } = useSelector((state: RootState) => state.auth); 
const onSubmit = (data: FormData) => {
  dispatch(tryChangeUsername(currentUser, data));
};

但我收到错误消息（'{} | User' 类型的参数不可分配给'User' 类型的参数。类型“{}”缺少“用户”类型的以下属性：id、用户名、电子邮件、社交和另外 2 个。）。我不确定我是否需要以不同的方式设置我的界面或初始状态或什么。我认为问题在于当前用户可以是一个空对象（尽管它不会在该组件中，因为该组件将是私有路由），但我不确定如何解决该问题。

【问题讨论】：

@ddcastrodd 我试过了，但仍然遇到基本相同的问题。现在我得到 currentUser 像 const { currentUser } = useSelector((state: RootState) => state.auth);所以我认为问题在于 currentUser 对象可以是空的，因为它的初始状态是一个空对象。但是如果我通过道具获得 currentUser ，那么我就没有这个问题。但我不想通过道具传递下去。我只是希望能够通过 useSelector 获得它。

标签： reactjs typescript redux

【解决方案1】：

在使用它的属性之前，你应该检查 currentUser 是 User 还是 {} 类型

function isUser(object: User | {}): object is User {
    return 'id' in object;
}

let currentUser: User | {};

if (isUser(currentUser)) {
    // make something
    currentUser.id;
}

【讨论】：