글 작성 성공 후 해당 글 ID로 라우팅변경관련 문의

Question

안녕하세요. 항상 좋은 컨텐츠로 강의해주셔서 감사히 잘 보고 있습니다. 라우팅을 어떤 방식으로 전개할지 잘 와닿지 않아서 문의드립니다. ㅠ 상황을 설명드리면... 1) `localhost:3000/post` 여기서 포스트 작성을 합니다. 2) 그래서 작성후에 저장이 되면 `localhost:3000/post/id` 이쪽으로 라우팅을 하려고 하는데요. 어떤식으로 라우팅을 트랜지션해야할지 잘 모르겠어서요. 상태는 리덕스 스토어를 사용하고 있습니다. 3) 저장 시 성공하면 백엔드쪽에서 포스트 정보랑 id를 json으로 넘겨줍니다. 예) 아래같이 코드가 있다고 가정하면 onSubmitHandler 함수 내부에 하고 싶은데 이렇게 되면 일단 클릭시 id도 없고 저장시까지 걸리는 핸들링이 유보되는것두 아니고 해서 이방법으로는 안되는거 같아서요. 구글로 how to route transition after saving data on react 등등으로 검색 했는데 결과가 신통치 않아요.ㅠ useEffect내부에 해야 하는건가요? 아니면 다른 방식으로 진행해야하나요? const onSubmitHandler = useCallback (() => { //... }, [ inputValue , editValue , mainPost ]) // useEffect(() => { // if (mainPost && mainPost.id) { // router.push(`/post/${mainPost.id}`) // } // }, [mainPost]) return ( < Container onSubmit = { onSubmitHandler } > < LabelInput label = "제목" inputValue = { inputValue } onChange = { onChangeInput } /> < Editor initialValue = "hello react editor world!" previewStyle = "vertical" height = "600px" initialEditType = "markdown" useCommandShortcut = {true} ref = { editorRef } onChange = { onChangeEditValue } /> < button type = "submit" > 저장 )

제로초(조현영) · Answer

post가 완료(SUCCESS)될 때 postDone reducer state를 true로 만들거나 post의 id를 기록하시고요. useEffect에서 postDone에 아이디가 들어오면 그걸 바탕으로 router.push하시면 됩니다.