본문 바로가기

Web/웹 프레임워크

[React] route와 saga를 이용한 url 이동 방법 근데 이제 history를 곁들인...

기존에는 화면 이동을 할 때 해당 요소에 link를 걸거나 onclick을 이용한다던가 했던거 같은데

 

react에서는 component가 여로곳에서 재사용되기 때문에 해당 요소에 주소를 걸어 link나 onclick을 사용한다면 뭔가 깔끔하지 않은거 같아서 다른 방법을 찾고 있었다.

 

내 기준 action.payload와 saga를 이용해서 관리가 된다 그리고 react-route가 사용됐다. 암튼 그래서 saga에서 원하는 페이지별로 맞는 데이터를 뿌려주므로 이곳에서 link 처리도 하고 싶어서 찾아봤다.

 

그랬더니 나왔다. 개꿀

 

제목은 route와 saga를 이용한 url 이동 방법으로 하겠다. 근데 이제 history를 곁들인

 

saga에서 라우터속에 history를 넣고 이를 이용해 페이지를 이동하는 방법이다. (push를 사용해)

react.vlpt.us/redux-middleware/12-redux-saga-with-router.html

근데 좀 찝찝해서 좀 더 찾아봤다.

 

import { createBrowserHistory } from "history";나

import { createBrowserHistory } from "react-redux";를 이용한다. 근데 react-redux는 v3에서만된다.

그래서 "history"에서 가져오는걸 찾아보니 

stackoverflow.com/questions/42893161/how-to-provide-a-history-instance-to-a-saga

 

이건 v4에서다

qastack.kr/programming/42701129/how-to-push-to-history-in-react-router-v4

 

생각을 해보니 내 프로젝트에서 사용되는 history를 가져오는 방법을 깨달았따.

그래서 ./store/index.js에 export돼있는 history를 가져다 썼다.

그랬더니 해결됐다. 개꿀

 

생각을 하고 개발하자고 생각했다.

'Web > 웹 프레임워크' 카테고리의 다른 글

[React] const {} = props 변수 선언  (0) 2020.12.31
리엑트 공식 홈페이지 doc  (0) 2020.12.02