history.goBack 질문

[열공맨]

안녕하세요. 특정 페이지는 axios로 데이터를 뿌려주는 페이지인데

다음페이지에로 넘어갔다가 goBack으로 뒤로갔다가 이 과정을 반복하면

특정 페이지에서 axios 라인이 코드가 무시되서 실행이 안되는데 무슨이유일까요?

[codingapple]

아마 axios 요청을 useEffect에서 하고 계신다면

useEffect가 다시 작동안해서 그런 것이 아닐까요 

[열공맨]

useEffect 안 콘솔은 다뜨는데 axios 요청되는 then 안에는 안뜹니다.

서버쪽문제인가해서 서버쪽에서도 요청올때 콘솔 찍어봤는데 애초에 넘오오질않네요.

브라우저 자체적으로 존재하는 왼쪽 상단 뒤로가기 화살표로 앞뒤로 왔다갔다할때는 문제가 없는데 앞서 질문드린대로 history로 이동시 반복적으로 하면 그런현상이 일어납니다.. 구글링해봐도 해법을 못찾겠네요 ㅜ

[codingapple]

get 요청했던 결과를 브라우저에 캐싱해놔서 그런가봅니다 

axios로 요청할 때 no-cache 옵션인가를 켜봅시다 

[열공맨]

원인은 파악했어요!! ㅠㅠ 

원인이 뭐였냐면 페이지 로드 될때 마다 해당 url을 DB내 pv 테이블에 쌓을려고 app.js에 useEffect로 axios 실행시켜놨는데, 현재 페이지가 너무 많아서 해당 컴포넌트 파일 열어서 현재 url을 useState로 변경하기 귀찮아서 app.js 에 url 변수 선언해두고 자바스크립트로 root 태그에 클릭이벤트리스너 걸면서 이벤트리스너내에 url state가 변경되도록해놨는데 이것때문에 다른컴포넌트 불러올때 문제가 생겼던것 같습니다.

이렇게되면 궁금한부분은 해당 컴포넌트 마다 열어서 변수 상태관리를 일일이 할수밖에없나요?

현재 브라우저에 보여지는 url이 바뀔때 바꼈다라는걸 잡아챌수있는 무언가가있는지 궁금합니다.

[codingapple]

let location = useLocation()

useEffect(() => {

}, [location])

라우터 라이브러리에 useLocation 훅 쓰면 현재 url 알려줍니다 

[글쓴이]

글