javascript - vue localStorages 관련 라우팅 값 페이지 새로 고침 오류

Question

관련 코드:

Vue를 이제 막 배우기 시작했는데, 제 JS 기반이 별로 좋지 않습니다. 잘못된 점이 있으면 언제든지 비판하고 지적해 주세요. 감사합니다.

productList 페이지가 점프한 후 인덱스 값에 따라 로컬 json 배열의 데이터를 가져와서 다른 페이지 데이터를 표시합니다. 점프를 클릭한 후에는 문제가 없지만 새로 고침 후에는 값을 얻을 수 없습니다. 프롬프트

으아아아

오류 메시지에 대한 설명을 찾아봤지만 잘 이해가 되지 않습니다. MOOC의 Vue 기본 튜토리얼에서 localStorages를 저장하는 방법을 따랐습니다.

으아아아 으아아아 으아아아 으아아아

Answer 1

json 형식이 잘못되었을 가능성이 높습니다.
우선 어디에서 오류가 발생했는지 판단해야 합니다.

1. 먼저 마운트된 모든 것에 주석을 답니다

2. 오류가 있는지 확인하세요

3. 그런 다음 하나씩 추가하세요

Chrome을 사용하는 경우 f12를 열고 애플리케이션으로 이동하면 localStorage의 값을 확인할 수 있습니다

가장 가능성이 높은 이유는 데이터를 json 형식으로 저장하기 전에 json이 아닌 데이터를 얻은 다음 json.parse가 오류를 보고하기 때문입니다