正しい方法減速

Question

私は活字体で角度2に、いくつかの減速ロジックを書いていますを実装し、私は基本的に

const addOption = (state: Array<Poll>, id: number, payload: any) => { 
    let pollToUpdate = {}; 

    state.map((poll) => { 
     if(poll.poll_id == id) { 
      pollToUpdate = poll; 
     } 
    }); 

    const newState = state.filter((elem) => { 
     return elem.poll_id !== id; 
    }); 

    pollToUpdate['options'].push(payload.new_option); 

    return [...newState, Object.assign({}, pollToUpdate)]; 
} 

次のロジックを持っているために、私は角に、次のインタフェースで定義されているオブジェクトの配列を持っています2

export interface Poll { 
    poll_id: number, 
    options: Array<{name: string, votes: number}>, 
    voter_ids: Array<number>, 
    createdBy: string 
} 

オプションの配列に新しいオブジェクトを追加しようとしています。ここ は減速コール

const action = { 
     type: 'ADD_OPTION', 
     payload: { 
      poll_id: 1, 
      new_option: {name: 'option 3', votes: 0} 
     } 
    }; 

    const nextState = reducer(initialState, action); 

は「不変」として減速ロジック数をいています。私はそれを正しい方法で実装していますか？

Answer 1

あなたのアプローチでは、次の瞬間を考慮する必要があります。

1. あなたのレデューサーは、理由なしで投票リストを並べ替えます。あなたが投票や何かを並べ替えることを許可したいと言うと、問題になる可能性があります。
2. 実際に変更された内側の配列optionsは同じままです。

私はこの

const addOption = (state: Array<Poll>, id: number, payload: any) => { 
    return state.map(poll => { 
     if(poll.poll_id === id) { 
      return {...poll, options: poll.options.concat(payload.new_option)} 
     } 
     return poll 
    }) 
} 

ようにそれを作ると思います