Typescript 反應 redux，類型 {} 上不存在屬性

Question

我正在使用反應 redux 和 typescript 創建身份驗證流程。 我設置了我的注冊身份驗證 state 接口和初始 state

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 state 讓用戶創建他們的用戶名（如果他們使用 google/facebook 注冊）。

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

但我收到錯誤（“{} 類型的參數 | 用戶”不能分配給“用戶”類型的參數。“{}”類型缺少“用戶”類型的以下屬性：id、用戶名、email、社交，還有 2 個。）。 我不確定是否需要以不同的方式設置我的接口或初始 state 或什么。 我認為問題在於當前用戶可能是一個空的 object （盡管它不會在該組件中，因為該組件將是私有路由）但我不確定如何解決該問題。

Answer 1

在使用它的屬性之前，您應該檢查 currentUser 是類型 User 還是 {}

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

let currentUser: User | {};

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