본문 바로가기

💻 프론트엔드 : Frontend/Svelte3

[Superforms] events Superform의 이벤트 흐름도 superform에는 폼 제출 이후에 실행가능한 이벤트가 다섯가지 존재합니다.(onChange 이벤트는 폼 제출 이전에 실행할 수 있기에 flowchart에 존재하지 않습니다.) 각 이벤트별 사용법const { form, enhance } = superForm(data.form, { onSubmit: ({ action, formData, formElement, controller, submitter, cancel }) => void onResult: ({ result, formEl, cancel }) => void onUpdate: ({ form, cancel }) => void onUpdated: ({ form }) => void onError: (({ res.. 2024. 12. 12.
svelte5 $effect 함수의 에러 Last ten effects were: ... 혹시 svelte5를 사용하며 이러한 에러를 마주친 적이 있으신가요?해당 에러는 $effect() 함수에서 발생하는 에러입니다. $effect() 함수가 무엇인지부터 말씀드리자면기존 svelte의 반응성 함수인 룬($:)과 동일한 효과를 지니는, 조금 더 업그레이드 된 버전이라 생각하시면 돼요.상태 변경(예: 외부 라이브러리에 렌더링 또는 외부 라이브러리와 상호 작용)에 따른 응답으로 코드를 실행한답니다. 다만 과도한 사용은 코드를 따라가기 어렵게 만들 수 있으므로 적당히 사용하라는 경고가 존재합니다.출처 : https://svelte.dev/docs/svelte/$effect $effect • Docs • SvelteEffects are what make your application do things.. 2024. 12. 1.
[Svelte] 스토어 구독 Svelte에서는 ‘구독’을 이용해 상태관리를 합니다.다른 프레임워크처럼 상태 관리 라이브러리가 따로 있는게 아니라 Svelte 내부(svelte/store)에 포함되어 있습니다.컴포넌트의 값이 변경될때마다 이를 구독하는 컴포넌트에게 변경된 값을 전달해주는게 목적이고, 스토어를 구독하는 방법은 다음처럼 두가지입니다.    1. subscribe() 함수를 이용   2. $ 기호 사용 subscribe()함수를 이용한 구독 ExampleStore1 스토어의 데이터: {value1}스토어를 구독하는 컴포넌트에서 subscribe()함수를 사용해 구독을 합니다.그러면 부모 컴포넌트에서 변화가 일어날때마다 위의 자식 컴포넌트는 자동으로 상태 변화를 감지할 수 있게 됩니다.다만 구독취소는 지원하지 않아 자식.. 2024. 8. 31.