前回の「【Monaca】Onsen UI + JavaScriptで買い物リストを作る」では、再起動するたびに買い物リストが消えてします。


今回は、localStorageを使用し、買い物リストを読み込み・保存する処理を付け加えます。

買い物リストを読み込む処理は、下記のとおりです。
初めて起動した場合、JSON.parse()の結果はnullとなるので、空の配列に直します。

買い物リストを保存する処理は、下記のとおりです。
配列の追加・修正・削除ごとに配置します。

localStorageには、下記のように保存されます。

入力したデータが保存され、アプリ再起動後にそのデータが読み込まれる、アプリらしくなってきました。

HUAWEI MediaPad T5 10 10.1インチタブレットW-Fiモデル RAM2GB/ROM16GB 【日本正規代理店品】

新品価格
¥20,072から
(2019/11/1 11:00時点)

【Monaca】Onsen UI + JavaScriptで買い物リストを作る その2
Tagged on: