Redux Reducer - 基于ID的过滤器数组，然后更改键/值对

Question

我有一个我想根据ID过滤的注释数组，并更改特定的键/值对。我的控制台日志函数返回数组中的正确项目，但我不确定使用.filter函数的结果并将'喜欢'键从'false'更改为'true'的正确语法。如果适合这种情况，我可以使用扩展运算符。

import * as types from '../actions/actionTypes'; 
import initialState from './initialState'; 

export default function commentReducer(state = initialState.comments, action) { 
    switch (action.type) { 
    case types.ADD_COMMENT_LIKE_SUCCESS: 
     const content = Object.assign({}, state); 
     const likedComment = content.data.filter(comment => (
     comment.id === action.commentId 
    )); 
     console.log(likedComment[0]); 
     break; 

    default: 
     return state; 
    } 
} 

的评论对象是这样的：

"data":{ 
     "data":[ 
     { id: '', comment: '', liked: false }, 
     { id: '', comment: '', liked: false }, 
     { id: '', comment: '', liked: false }, 
     { id: '', comment: '', liked: false } 
     ], 
     "cursor":"CkUKEQoEZGF0ZRIJCNrwhcWhvdUCEixqFGRldn5kZXZlbG9wbWVudC0xMzAwchQLEgdDb21tZW50GICAgLSe_-cKDBgAIAE=", 
     "more":false, 
     "count":4 
    }, 

Answer 1

您使用的是有正确的语法的过滤功能，虽然你的减速机应该与喜欢的键值对，尤其是评论返回所有的评论如此，您可以如何继续使用使用地图功能相同的。

import * as types from '../actions/actionTypes'; 
import initialState from './initialState'; 

export default function commentReducer(state = initialState.comments, action) { 
    switch (action.type) { 
    case types.ADD_COMMENT_LIKE_SUCCESS: 
     const content = Object.assign({}, state); 
     content.data = content.data.map(comment => { 
         const newObj = {...comment}; 
         if(newObj.id === action.commentId) 
         { 
          newObj.likeKey = true; 
         } 
         return newObj; 
     }); 
    console.log(content); 
    return content; 
    default: 
     return state; 
    } 
} 

地图functin将返回您到目前为止的所有评论，并更改该特定评论对象。希望这可以帮助。

Answer 2

我会使用find而不是过滤器，因为它总是只返回一个项目。

我不能完全肯定你如何分裂的状态，但我可以建议返回，如：

import * as types from '../actions/actionTypes'; 
import initialState from './initialState'; 

export default function commentReducer(state = initialState.comments, action) { 
    switch (action.type) { 
    case types.ADD_COMMENT_LIKE_SUCCESS: 
     const otherComments = state.data; 
     const likedComment = state.data.find(comment => (
     comment.id === action.commentId 
    )); 
     const index = state.data.indexOf(likedComment); 

     return { 
      ...state, 
      data: { 
       [ 
        ...otherComments.slice(0, index), 
        { ...likedComment, liked: true }, //Override properties here 
        ...otherComments.slice(index + 1) 
       ] 
      } 
     }; 

    default: 
     return state; 
    } 
} 

没有必要从国家复制的内容，因为我不修改状态。

基本上我：

1. 复制state和压倒一切的data键与...的所有评论
2. 一个副本和我副本likedComment串联，但与被覆盖的数据