使用Redux Starter Kit与Immer时findIndex无法匹配日期的问题求助
解决Redux Starter Kit(Immer)中无法定位对应周状态的问题
我之前碰到过完全一样的坑——用Redux Starter Kit写reducer时,想通过date字段找到数组里对应的周对象,结果findIndex始终返回-1,根本定位不到正确索引。
先说说我的状态结构,和你这个几乎一致:
[ { date: moment("2019-06-15").toObject(), attendance: [ { name: "Ruben Hensen", membershipNumber: "2084700", attending: true, present: false }, { name: "Peter Petersen", membershipNumber: "2084701", attending: true, present: false }, { name: "Karel Kootjes", membershipNumber: "2084702", attending: true, present: false }, { name: "Niedaar Mennekes", membershipNumber: "2084703", attending: true, present: false }, ] }, ... ]
最开始我写的reducer代码是这样的:
TOGGLE_PRESENCE: (state, action) => { console.log(state); console.log(action); const index = state.findIndex(week => week.date === action.payload.date); console.log(index); // 一直输出-1! }
问题出在哪?因为Redux Starter Kit集成了Immer,它会用Proxy包装你的state对象。直接用===比较两个对象(哪怕内容完全一致)肯定不相等——一个是Immer生成的Proxy对象,另一个是原始的moment转成的对象,内存地址不一样,自然匹配不上。
后来在@markerikson的帮助下,我把代码改成这样,问题立刻解决了:
const index = state.findIndex(week => moment(week.date).isSame(action.payload.date));
核心思路就是别直接比较对象引用,而是用moment的isSame方法对比日期的实际值。不管week.date是Immer包装后的Proxy对象还是原始对象,用moment重新解析成实例后,isSame能准确判断是不是同一个日期。
内容的提问来源于stack exchange,提问作者Ruben Hensen
相关产品推荐
相关产品推荐

