React-Native中能否从Reducer Action获取返回值?求替代方案
解决Redux中直接获取单个用户数据的方案
嘿,我明白你的困扰——不想新增额外的pickedUser状态,又嫌直接调用store.getState()太繁琐,还好奇能不能通过Action拿到返回值。先给你明确一个核心点:Redux的Action本身是没法直接返回状态数据的,因为它遵循单向数据流,Action只是触发状态变更的“指令”,不是能返回结果的函数调用。不过有几个更优雅的方案可以满足你的需求:
1. 使用Selector函数(推荐,Redux官方最佳实践)
这是从现有状态中派生数据的标准方式,不用新增状态,还能保证性能。如果你的场景比较复杂,推荐用reselect库创建记忆化(memoized)的selector,避免不必要的重复计算。
示例代码:
首先创建一个selector文件:
// selectors.js import { createSelector } from 'reselect'; // 基础selector:获取Redux中的用户数组 const selectUsers = state => state.users; // 记忆化selector:根据用户ID筛选出目标用户 export const selectUserById = createSelector( [selectUsers, (state, userId) => userId], // 依赖的状态和传入的参数 (users, userId) => users.find(user => user.id === userId) // 派生逻辑 );
然后在组件中通过useSelector调用:
import { useSelector } from 'react-redux'; import { selectUserById } from './selectors'; const UserDetail = ({ targetUserId }) => { // 直接获取目标用户,不用额外状态 const pickedUser = useSelector(state => selectUserById(state, targetUserId)); if (!pickedUser) return <Text>用户不存在</Text>; return <Text>用户名:{pickedUser.name}</Text>; };
记忆化的好处是:只有当用户数组或者传入的userId发生变化时,selector才会重新计算,避免组件每次渲染都执行find操作,性能更优。
2. 直接在组件中用useSelector派生数据(简单场景)
如果你的筛选逻辑很简单,也可以不用reselect,直接在useSelector里写派生逻辑:
const pickedUser = useSelector(state => state.users.find(user => user.id === targetUserId) );
这种方式更简洁,但如果用户数组很大,每次组件渲染都会执行find,可能有性能损耗,复杂场景还是推荐第一种方案。
3. 关于“调用Action获取返回值”的说明
Redux的Action creators(包括Thunk)本质上不能直接给组件返回状态数据:
- 普通Action creators只是返回一个Action对象,触发Reducer更新状态,没有返回值;
- 即使是Redux Thunk,虽然可以在函数里访问
getState()获取当前状态,但它的作用是处理异步逻辑或者复杂状态更新,而不是给组件返回数据。如果在Thunk里获取用户再dispatch一个setPickedUser的Action,其实就是你提到的新增状态的方式,反而不如selector直接。
总结
最符合你需求的方案就是使用Selector函数——既不用新增额外状态,也不用繁琐地直接操作store,还完全符合Redux的设计理念,组件代码也更简洁。
内容的提问来源于stack exchange,提问作者Bright Lee
相关产品推荐
相关产品推荐

