Question

所以我有一个数组chosenIds[]，它基本上会包含ids (numbers)的列表。但是我在我的reducer中访问状态时遇到问题，无法检查ID I parsed to my action是否在数组中。

  const initialState = {
  'shouldReload': false,
  'chosenIds': [],
};

export default function filter(state = initialState, action) {
  switch (action.type) {


 case ADD_TYPE:
      console.log(state.chosenIds, "Returns undefined???!!!");

      // Check if NUMBER parsed is in state
      let i = state.chosenIds.indexOf(action.chosenId);

      //If in state then remove it
      if(i) {
        state.chosenIds.splice(i, 1);
        return {
          ...state.chosenIds,
          ...state.chosenIds
        }
      }
      // If number not in state then add it 
      else {
        state.chosenIds.push(action.chosenId)
        return { ...state.chosenIds, ...state.chosenIds }
      }

我不确定发生了什么......但是当我记录state.chosenIds时，它会返回undefined？它甚至不返回初始的空数组[]。

基本上这个函数要做的是检查action.chosenId是否在state.chosenIds中，如果是，则删除action.chosenId值，如果不是，那么将action.chosenId添加到州。

Answer 1

我在这里看到了一些不同的问题。

首先，您在已经处于状态的阵列上使用"Statement Date"和splice()。这是直接突变，打破了Redux。您需要复制数组，然后修改该副本。

其次，对象传播使用看起来并不正确。您正在使用它，好像＆＃34; selectedIds＆＃34;是一个对象，但它是一个数组。此外，您还要重复点差。这导致返回的状态不再具有名为＆＃34; selectedIds＆＃34;的字段。

第三，Array.indexOf（）如果找不到则返回-1，实际上算作＆＃34; truthy＆＃34;因为它不是0.所以，当前的if / else赢了，就像你期望的那样。

我会把你的减速器改写成这样：

push()

Answer 2

另一种具有独立功能的方法：

export default function reducer(state = initialState, action) {
    switch(action.type) {
        case ADD_TYPE:
             function upsert(array, item) {
    // (1)
    // make a copy of the existing array
    let comments = array.slice();
    const i = comments.findIndex(_item => _item._id === item._id);
    if (i > -1) {
      comments[i] = item;

      return comments;
    }
    // (2)
    else {
      // make a copy of the existing array
      let comments = array.slice();
      comments.push(item);

      return comments;
    }
  }

            return {
     ...state,
    comments: upsert(state.comments, action.payload),
            };
        default:
            return state;
    }    
}

Redux reducer，检查状态数组和更新状态中是否存在值

2 个答案: