React 状态下的过滤器错误

Question

我在 reducer 中有一个初始状态。我从 api 产品中获取，我应该按键检查，如果产品没有重复，我将其放入状态。如果重复 - 什么也不做。错误是过滤器不起作用，产品重复。

    const defaultState = {  
      productsInMyList: [],
    };
   
 //get prodouct
        const { productsInMyList } = action.payload;
    
//check, if it is in state or not          
              const sameProductsInMyList =    
    !!state.productsInMyList.includes(
                productsInMyList.key
              );
         
          const newProductsInMyList = sameProductsInMyList
            ? state.productsInMyList
            : [...state.productsInMyList, productsInMyList];
    
          return {
            ...state,
            productsInMyList: newProductsInMyList,
            
          };

Answer 1

我把includes改成了find。感谢大家的帮助。

const sameProductInMyList = !!state.productsInMyList.find(
        (item) => item.key === productsInMyList.key
      );

Answer 2

根据您的评论，我怀疑 state.productsInMyList 是一个对象数组，而 productsInMyList 也是一个对象。 Array.prototype.includes 仅适用于基元和浅层对象相等（即引用相等）。

如果您正在比较数组中的对象并想知道数组是否包含某些符合条件的元素，那么您将需要使用 Array.prototype.some，即是否存在 这个数组中的一些个元素满足这个条件。

const sameProductsInMyList = state.productsInMyList.some(
  product => product.key === productsInMyList.key
);

React 状态下的过滤器错误

mistakes in filter in React state

filter

include

reactjs

redux