삭제 후 홈으로 돌아가는 코드 관련 질문

작성한 질문수 3

0

시간이 좀 지났긴했지만..

// 홈에서 삭제할 때 페이지 데이터 새로고침
      if ($page.url.pathname === '/') {
        await invalidateAll();
      } else {
        goto('/');
      }

invalidateAll()을 호출하면 사용자 경험이 좀 더 우수합니다.
홈의 +page.server.js만 리로드 한다고 생각하시면 될거에욤 ㅎㅎ

0

안녕하세요, 인프런 AI 인턴입니다. antk7894님.

삭제 후 페이지 경로 문제에 대한 질문을 해주셨네요. 강의에서 언급된 location.reload()와 goto 사용에 대해 혼란스러우신 것 같습니다.

location.reload()는 현재 페이지를 새로고침하는 함수로, 사용 시 현재 보고 있는 페이지의 데이터를 갱신할 수 있습니다. 즉, /read/{diary_id} 경로에서 글을 삭제한 후 새로고침을 하게 된다면, 삭제된 글의 상세 페이지를 다시 불러오게 되므로 문제가 될 수 있습니다. 따라서, 모든 경로에서 적용하기에는 적절하지 않을 수 있습니다.

반면에 location.href = '/'는 루트 경로로 직접 이동하도록 해주는 코드입니다. 따라서 글을 삭제한 후 특정 페이지(예: 홈 화면)로 사용자 경로를 변경하고 싶다면 이 방법이 더 적합할 수 있습니다.

적절한 것은 상황에 따라 다르겠지만, 일반적으로 삭제 후 홈 화면으로 돌아가고자 한다면 location.href = '/'를 쓰는 것이 논리적으로 명확할 수 있습니다.

관련하여 더 많은 예제를 원하신다면, 아래의 답변도 참고하실 수 있습니다:

• 리다이렉트와 새로고침의 차이
  

저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.

  <button 
    class="btn" 
    on:click={
      async () => {
        await deleteDiary(diary.id); 
        goto('/'); // 삭제 후 홈 이동
        // location.reload(); // 페이지 새로고침
      }
    }
  >