React TypeScript Redux：Action Creator返回值字段无法访问问题

你的问题出在直接调用thunk action creator而没有通过Redux dispatch执行：

• login是一个Redux Thunk action creator，它返回的是一个接收dispatch参数的异步函数，而非直接返回请求结果的Promise。
• 你直接await login(...)拿到的是这个函数本身，不是函数执行后返回的response.data。控制台打印看似是目标对象，是因为浏览器控制台会自动展开函数执行后的结果，但实际变量存储的是函数，所以无法访问其字段。

解决步骤 #

1. 通过Redux的dispatch调用这个action creator，Thunk中间件会自动执行返回的异步函数，并将其返回值（也就是response.data）传递回来：

// 如果你用的是React-Redux，先获取dispatch
import { useDispatch } from 'react-redux';

// 在组件内
const dispatch = useDispatch();
// 用dispatch包裹login调用
let principal = await dispatch(login(email.value, password.value));
console.log(principal.id); // 现在可以正常访问对象字段

2. 额外检查：确保IUser类型定义包含你需要访问的所有字段，避免TypeScript类型报错。

内容的提问来源于stack exchange，提问作者Matvey Androsyuk