sveltesvelte-store

How to persist svelte store

Is there any direct option to persist svelte store data so that even when the page is refreshed, data will be available.

I am not using local storage since I want the values to be reactive.

Solution

  • You can manually create a subscription to your store and persist the changes to localStorage and also use the potential value in localStorage as default value.

    Example

    <script>
  import { writable } from "svelte/store";
  const store = writable(localStorage.getItem("store") || "");

  store.subscribe(val => localStorage.setItem("store", val));
</script>

<input bind:value={$store} />