は、私は私の最初の状態を持って減速

Question

に初期状態にオブジェクトを追加しますか？オブジェクトに配列を追加するには、どのようにレデューサーを変更する必要があるのでしょうか。ただ1つではなく、たくさんの項目を保存することができます。

[{ 
    drinkType: 5, 
    drinkVolume: 4, 
    drinkStrength: 5, 
    drinkQuantity: 5, 
    drinkStength: 5 
}, 
{ 
    drinkType: 1, 
    drinkVolume: 2, 
    drinkStrength: 2, 
    drinkQuantity: 5, 
    drinkStength: 7 
}, 
{ 
    drinkType: 3, 
    drinkVolume: 5, 
    drinkStrength: 2, 
    drinkQuantity: 5, 
    drinkStength: 5 
}, 
{ 
    drinkType: 5, 
    drinkVolume: 5, 
    drinkStrength: 5, 
    drinkQuantity: 5, 
    drinkStength: 5 
} 
] 

更新：

私は私の状態はになりたい、私は私の状態にコピーされたネストされたオブジェクトを取得しています、私はトップレベルのプロパティを取得し、配列にオブジェクトとして追加したいと思います。

私はここにアクションを発射：

onClick() { 
const drinkQuantity = this.state.counter; 

const drinks = this.props.DrinksCalculator; 

if (!drinkQuantity) { 
    this.props.dispatch(showError()); 
} else { 
    this.props.dispatch(updateDrinksCalculator({drinkQuantity})); 
// fire addDrink to copy drinks props in new object 
    this.props.dispatch(addDrink(drinks)); 

    this.props.router.push('/calc/5'); 
} 
} 

Answer 1

私は右のあなたを理解していれば、あなたの状態に新しい属性を追加します。

const initialState = { 
    drinkType: null, 
    drinkVolume: null, 
    drinkStrength: null, 
    drinkQuantity: null, 
    drinkStength: null 
}; 
const someReducer=(state=initialState,action) => { 
    switch (action.type) { 
    case "SOME_ACTION":{ 
    let newState= Object.assign({},state,{newAttribute:["value1","value2"]}); 
    return newState; 
    } 
} 

これにより、newAttributeプロパティが設定された状態が作成されます。

個人的に私はinitialStateで使用するすべてのプロパティのリストが好きです。コードを読んでいる人が、使用するプロパティとその中のデータを簡単に理解できます。

配列にオブジェクトを押す別の例

dispatch({ 
    type:"ADD_QUESTIONS", 
    question:{ 
    drinkType: 5, 
    drinkVolume: 4, 
    drinkStrength: 5, 
    drinkQuantity: 5, 
    drinkStength: 5 
    } 
}) 

const initialState = { 
    questions:[] 
}; 

const someReducer=(state=initialState,action) => { 
    switch (action.type) { 
    case "ADD_QUESTIONS":{ 
    let newState= Object.assign({},state); 
    newState.questions.push(action.question); 
    return newState; 
    } 
}