Redux 사용해서 게시글 수정시 이렇게 하는게 맞나요?

Question

안녕하세요!퇴근후에 공부를 하려니 좀처럼 늘지가 않네요.. ㅜㅜ우선은 nextjs &#43; redux tookit &#43; typescript &#43; MUI을 이용해서 간단한 페이지를 만들어보려고 하는데요,어찌저찌 조회 페이지를 만들었는데 수정을 하려니까 잘 안되어서요..(DB에 임시로 데이터를 넣고 조회 부터 해서 아직 저장 기능은 아직입니다 ㅎ)const {product}: RootState &#61; useAppSelector((state) &#61;> state.product);useAppSelector를 사용하여 state에 저장한 값을 불러왔고페이지에는 <TextField value&#61;{product.name}/> 이런 식으로 뿌려주었습니다.근데 이걸 수정 하려고 하는데 키보드를 쳐도 수정이 되지 않더라고요??찾아보니 onChange에 state 값을 변경해주도록 미리 설정을 해야 하는 것 같은데그럼 모든 입력 페이지마다 onChange를 달아주는게 맞나요?useRef를 사용하여 리렌더링을 막아주는 방법도 있던거 같던데그럼 애초에 화면에 뿌려주는 데이터는 state --> useRef 로 변환해서 뿌려줘야 하는건지...보통은 어떻게 해주고 계신지 너무 궁금합니다!!!그럼 오늘도 좋은 하루 보내세요 ㅠㅜ

킁킁탐정 · Answer

다음 문서를 모두 읽어보세요.추가로 react controlled vs uncontrolled로 검색해보세요.https://ko.reactjs.org/docs/uncontrolled-components.htmlhttps://ko.reactjs.org/docs/forms.html#controlled-componentshttps://mui.com/material-ui/api/text-field/#props defaultValue 부분 참조

JengYoung · Answer

redux에서 store에서의 상태가 변화하지 않았기 때문에, 아마 값 입력이 안될 것 같습니다.redux 는 Flux 패턴을 따르며, 해당 상태를 변경하기 위해서는 action 을 dispatch 해야합니다.useAppSelector이 뭔지 몰라서 공식문서 확인해보니 useSelector로 확인되는군요.https://ko.redux.js.org/usage/usage-with-typescript/#typing-the-useselector-hook다음 공식문서의 내용을 참고하시면 문제를 해결할 수 있을 것 같아요.https://ko.redux.js.org/tutorials/fundamentals/part-5-ui-react/#reading-state-from-the-store-with-useselector쉽게 말씀드리자면 useSelector은 단순히 값을 가져오기 위한 getter의 역할이며, useDispatch는 액션에 대한 함수를 호출하기 위한 역할이라 볼 수 있겠네요.즉, useDispatch 및 기타 리듀서 함수 로직을 작성하여, onChange 핸들러로 전달하면 됩니다.

Redux 사용해서 게시글 수정시 이렇게 하는게 맞나요?

2개의 답변

#redux 목록