⚛️ React/개념(Redux)

React : state 공유하는 "Redux" (state 변경함수/파라미터/함수분리)

state 변경하는 법 useState()와는 다른 방식을 써야 한다. state를 수정해주는 함수를 만들고, 그 함수를 실행해야 할 때 store.js에 요청해야 한다. store.js에서 state 변경함수 만들기 let user = createSlice({ name : 'user', initialState : 'kim', reducers : { changeName(){ // state 값 변경함수 1 return 'Park' }, changeFullname(){ // state 값 변경함수 2 return 'Kim Noran' } } }) export let { changeName, changeFullname } = user.actions // 함수 export store.js에 변경함수를 만든다...

React : state 공유하는 "Redux" (state 보관/사용)

store에 state 보관하는 법 import { configureStore, createSlice } from '@reduxjs/toolkit' let 작명 = createSlice({ name : 'state 이름', initialState : 'state 값' }) let user = createSlice({ name : 'user', initialState : 'kim' }) let stock = createSlice({ name : 'stock', initialState : [10,11,12] }) export default configureStore({ reducer: { 작명 : createSlice만든거.reducer, user : user.reducer, stock : stock.red..

React : state 공유하는 "Redux" (설치)

컴포넌트간에 state 전송 없이도 Redux를 사용하면 state를 공유할 수 있다. js파일을 하나 만들어서 state를 몰아넣는 식이다. Redux 설치 전 확인사항 { ... "react": "^18.2.0", "react-dom": "^18.2.0", ... } package.json 파일에서 reat/react-dom 버전이 18.1버전 이상인지 확인하자. 설치하는 법 터미널 설치 npm install @reduxjs/toolkit react-redux store.js 파일생성 import { configureStore } from '@reduxjs/toolkit' export default configureStore({ reducer: { } }) src폴더에 store.js 파일을 생성해 ..