인프런 커뮤니티 질문&답변
작성한 질문수
Vue3 Pinia 초기화 문의
24.10.14 13:17 작성
·
32
0
안녕하셔요.
강좌 잘 보고 있습니다.
문의드릴 내용은 Vue3 Pinia state 값을 Composable API를 사용 할때 초기화를 해야 되는지 궁금해서 문의 드림니다.
인터넷을 찾아보니 $reset 함수를 사용해서 공통 Plugin에 등록하고 난 후, 호출하는 페이지에서 reset 함수를 호출하면 된다고 합니다.
제 짧은 생각에는 pinia store 호출하는 함수(actions)에서 state값을 초기화를 하고 사용하면 될 것 같아 보이는데..
공통으로 만들어서 제공을 해야 하는지 궁금합니다.
예제 소스)
[main.js]
...
const pinia = createPinia();
pinia.use(({ store }) => {
const initialState = cloneDeep(store.$state);
store.$reset = () => store.$patch(cloneDeep(initialState));
});
....
[호출 페이지]
....
onBeforeUnmount(() => {
store.$reset();
});
...
답변 2
0
2024. 10. 14. 14:23
Pinia의 $reset()을 플러그인으로 등록하면 모든 페이지에서 공통적으로 상태를 초기화할 수 있어 편리합니다. Composable API에서 actions로 직접 초기화하는 것도 가능하지만, 플러그인을 사용하면 재사용성과 일관성이 높아집니다.
0
2024. 10. 14. 13:21
안녕하세요, 인프런 AI 인턴입니다. 김경주님께서 궁금해하시는 Vue3와 Pinia의 관련된 사항에 대해 답변드리겠습니다.
Pinia의 state값을 초기화하는 방법은 여러 가지가 있으며, 말씀하신 $reset 메서드를 사용하는 방법이 대표적입니다. Pinia에서 state 초기화와 관련된 전략은 프로젝트의 성격과 요구 사항에 따라 달라질 수 있습니다.
$reset 메서드는 Pinia의 현재 상태를 초기 상태로 되돌립니다. Pinia에서 전체적인 초기화 루틴을 공통으로 관리할 수 있도록 설정하는 것은 좋은 관행입니다. 특히, 여러 컴포넌트에서 동일한 초기화 로직을 사용해야 하는 경우라면 더욱 그렇습니다.
다음과 같은 관련 질문과 답변이 도움이 될 수 있습니다:
- 안녕하세요 🙂 각 컴포넌트의 상태는 컴포넌트에서 관리하고 Pinia로 전역 관리할 상태만 관리하는 게 좋습니다!
- 안녕하세요 🙂 페이지를 이동해도 Pinia의 상태는 일반적으로 초기화되지 않습니다.
Pinia로 상태를 중앙에서 관리할 경우, 특히 상태의 복구 또는 초기화가 필요한 경우 공통적인 관리 방법을 사용하여 일관성과 유지보수를 개선할 수 있습니다. 이 외에도 상태의 변경을 추적하거나 로그를 남기는 등의 다양한 추가 설정을 핸들할 수 있습니다.
저는 질문자님의 이해를 돕고자 지식공유자님의 기존 답변을 참고하여 유사한 답변 링크를 추천해드리고 있습니다. 현재 베타 기능으로 답변이 만족스럽지 않을 수 있는 점 양해 부탁드립니다. 🙏 추가적으로 궁금한 점이 있으시면, 이어서 질문해 주세요. 곧 지식공유자께서 답변해 주실 것입니다.