구현된 화면

---

코드

추가 state저장하고 싶을 떄

추가로 state 저장하고 싶으면 reducer를 하나 더 만들면 된다.
기존 reducer도 있기 때문에 reducer2도 store에 할당하려면,
combineReducers({reducer, reducer2})으로 작성하면 된다.

index.js

let alert초기값 = true;

function reducer2(state = alert초기값, 액션) {
  if(액션.type === '닫힘') {
    state = false;
    return state;
  } else {
    return state;
  }
}


let store = createStore(combineReducers({reducer, reducer2}));

reducer가 두개 이상이면 아래 함수 내의 state도 바뀌게 된다.

Cart.js

function state를props화(state){
  console.log(state);
  return {
    state : state.reducer,
    alert열렸니 : state.reducer2
  }
}

console.log(state)

console.log(state)를 해보면 사진과 같이 {reducer, reducer2} 객체 안에 각각 들어가 있는 모습을 알 수 있다.
따라서 return문에 내가 편하게 사용할 수 있도록 key이름을 작명하고 그에 맞는 값을 할당해주면 된다.

reducer2 활용 시

reducer2를 사용하는 코드

    { 
      props.alert열렸니 === true
      ? (<div className="my-alert2">
      <p>지금 구매하면 신규할인 20%</p>
      <button onClick={()=>{ props.dispatch({ type : '닫힘' })}}>닫기</button>
    </div>)
      : null
    }   

---