首页 > 解决方案 > useSelector 和映射函数 React Redux

问题描述

我想遍历一个数组,但我不确定是否可以在 useSelector redux 钩子中执行此操作,因为它没有给我想要的结果。你们中有人实现过吗?还是我完全错了?

索引.jsx

const test = useSelector(state => state.data.map(e => e.details));

数据.js

    data: [
        {
            name: 'long neck',
            details: {
                total: 1,
                height: "3ft",
                weight: "34 lbs",               
            }
        },
        {
            name: 'fun fact',
            details: {
                total: 30,
                height: '1ft',
                weight: '16 lbs',
            }
        },
    ],

标签: reactjsredux

解决方案


我认为你不应该那样做。

因为每次调用 useSelector 时都会返回一个新数组。

我认为正确的方法是返回实际数据,然后像这样在外面进行过滤。

const data = useSelector(state => state.data);

const details = calculateDetails() => {

   //do all your filtering, mapping, slicing
   return data.map(e => e.details));
};

我这样做的原因是避免在没有任何变化时进行渲染。

你不应该从 useSelector 返回新对象,除非你使用第二个参数,它是一个相等检查函数。


推荐阅读