IT이야기

수분 보충 직후 Vuex 상태를 변경하시겠습니까?

cyworld 2022. 6. 30. 23:30
반응형

수분 보충 직후 Vuex 상태를 변경하시겠습니까?

My Vue 애플리케이션은 서버 측 렌더링을 사용합니다.앱이 로드되어 수화되면 클라이언트의 상태를 검출하여 변이를 하고 싶습니다.

앱을 마운트하기 전에 상태를 터치하면 예상대로 다음 경고가 출력됩니다.

[Vue warn] :클라이언트 측에서 렌더링된 가상 DOM 트리가 서버 렌더링 컨텐츠와 일치하지 않습니다.이는 잘못된 HTML 마크업이 원인일 수 있습니다(예: 블록 레벨 요소를 내부에 중첩).<p>또는 누락됨<tbody>. 수화 처리 및 전체 클라이언트 측 렌더링을 수행합니다.

수분이 끝나면 바로 부를 있는 갈고리를 찾을 수 있을 것 같아서요.

변이를 저지르려고 했는데mounted메인 컴포넌트의 후크.저도 한번 해봤는데app.$mount(...), 및 와Vue.nextTick()이 모든 것은 너무 빨랐습니다.이러한 경우 모두 위의 경고를 받습니다.

두 가지 해결 방법을 찾았습니다.

  1. 추가mounted하위 구성요소에 후크가 있으며 수정된 상태에서 다르게 렌더링됩니다.그 훅은 부모 훅의 이름을 따서 호출됩니다.네, 일단은 한 곳만 쓰면 되니까.하지만 두 개의 다른 컴포넌트에서 필요할 때 더러워질 수 있습니다.

  2. 무명 사용setTimeout()쉽게 깨진다.수분이 다 되었는지 확인할 방법이 없어서 폴링을 할 수 없다.data-server-rendered아트리뷰트는 하이드레이션이 시작되면 삭제됩니다).

어떻게 이 문제를 제대로 해결할 수 있는지 알고 있나요?

언급URL : https://stackoverflow.com/questions/46729134/change-vuex-state-right-after-hydration

반응형