redux state 변경 3step

redux state 변경 3step

1. state 변경해주는 함수 만들기

2. export 하기

3. dispatch( state변경함수() )

 

 

redux의 store의 state 변경하는법

먼저, reducer 함수를 만들고 그곳에 state 수정해주는 함수를 만들고

원할 때  dispatch() 함수를 사용해 reduce에 써진 함수를 실행해달라고 store.js에 요청하면 된다.

 

 

 

state 수정하는 법

1. state 수정해주는 함수 만들기 -  reducers

let user = createSlice({
    name: 'user',
    initialState:'backminjoo',
    reducers : {
        changeName(state){  // 기존 state를 뜻함
            return 'john ' + state 
        }
    }   
})

 

2. 만든 함수 reducers 로 만든 함수 밑에 export 해야함

//user.action - 위에 있던 state 변경함수들이 남는다.

export let {changeName} = user.actions

 

 

 

3. 만든 함수 import 해서 사용

예제 ) 버튼 누르면 state 를 john kim으로 변경하려면?

import { changeName } from './../store.js' //changeName 함수 먼저 import해서 사용하기
import { useDispatch } from "react-redux"

...
function Cart() {
	let dispatch = useDispatch()
...

다음, useDispatch()라는 함수도 필요하다

dispatch 란 store.js로 요청보내주는 함수이다.

 

 

 

dispatch사용할때는

dispatch(state변경함수()) 이렇게 사용하면 된다.

<button onClick={()=>{
	dispatch(changeName())
    }}>+</button>