[React] extraReducer

현재 사용하고 있는 라이브러리

- react-redux, immer, @reduxjs/toolkit

 

 add car form에 데이터를 입력하고 submit하면

carList에 추가하고 form의 textinput을 비워주고 싶다면?

 

formSlice.fs에서 extraReducers로 carsSlice.jfs의 addCar와 연결해주면 된다

addCar가 호출한다면 폼을 비워주라는거임

 

import {createSlice} from '@reduxjs/toolkit';
import { addCar } from './carsSlice';

const formSlice = createSlice({
    name:'form',
    initialState:{
        name:'', cost:0
    },
    reducers:{
        changeName(state,action){
            state.name = action.payload;
        },
        changeCost(state,action){
            state.cost = action.payload;
        }
    },
    extraReducers(builder){
        builder.addCase(addCar, (state,action)=>{
            state.name = '';
            state.cost = 0;
        });
    }
});

export const {changeName, changeCost} = formSlice.actions;
export const formReducer = formSlice.reducer;