arrays - Svelte のローカル ストレージに更新するネストされたアレイ ストアを作成する方法を教えてください。

Question

オブジェクト内の配列もストアとして使用できるストアとしてオブジェクトを作成したいと考えています。各配列を更新 (サブスクライブ) する必要があり、オブジェクトもローカル ストレージに更新する必要があります。

これがオブジェクトの構造です

{
   "expenses":[
      {
         "name":"sam",
         "id":1
      },
      {
         "name":"bob",
         "id":2
      }
   ],
   "options":[
      ...
   ]
}

これまでのコードは次のとおりです。

import { writable } from "svelte/store";

// get local storage
let storage = localStorage.getItem("userInputs");

// if storage exists, use it. otherwise set empty array
export let userInputs = writable(JSON.parse(storage) || []);
export let userExpenses = writable(storage.expenses || []);
export let userOptions = writable(storage.options || []);

// subscribe inputs to localStorage
userInputs.subscribe((val) =>
    localStorage.setItem("userInputs", JSON.stringify(val))
);

アプリ全体でuserExpensesとuserOptionsをストアとして使用できるようにしたいと考えています。これらの配列が更新されると、マスターuserInputsオブジェクトで更新する必要があり、これを localStorage にプッシュする必要があります。

ありがとうございました