はじめに

NativeScript でデータの 保存/読み出し を行う方法を整理した。

TL;DR

  • ApplicationSettings を使う
    • const appSettings = require("tns-core-modules/application-settings");
    • appSettings.getXXXX, appSettings.setXXXX, appSettings.hasKey, etc
この記事が参考になった方
ここかここからチャージや購入してくれると嬉しいです(ブログ主へのプレゼントではなく、ご自身へのチャージ)
欲しいもの / Wish list

目次

  1. はじめに
  2. TL;DR
  3. 環境・条件
  4. 詳細
  5. まとめ
  6. その他・メモ
    1. その他の方法
  7. 参考文献

環境・条件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
$ sw_vers
ProductName:	Mac OS X
ProductVersion:	10.15.3
BuildVersion:	19D76

$ node -v
v12.7.0

$ npm -v
6.10.3

$ tns --version
6.4.0

$ grep -C1 version package.json
    "tns-ios": {
      "version": "6.0.1"
    },
    "tns-android": {
      "version": "6.0.0"
    }
  • iPhone 11 Pro: iOS 13.3
  • Android HUAWEI nova lite 2: Android 9 (ビルド 9.1.0.160)

詳細

一番シンプルな方法は公式ガイドに書かれている通り、ApplicationSettings を使う方法。
参考: Client-Side Storage in NativeScript Applications

getNumber, setNumber, hasKey, remove などのメソッドで、localStorage のようにアクセスが可能。

なお、getXXXX は第2引数を設定することで、データ未設定時のデフォルト値を設定可能。

以下は、ページの表示回数を 読み出し/更新 するサンプル。
コミット: 4033286d24fa31918ed41a2ff9239eddb8483cf7

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<script >
  const appSettings = require("tns-core-modules/application-settings");
  export default {
    data() {
      return {
        access: 0,
      };
    },
    mounted() {
      this.access = appSettings.getNumber("access", 0) + 1;
      appSettings.setNumber("access", this.access);
    },
  }
</script>

まとめ

  • ApplicationSettings を使う
    • const appSettings = require("tns-core-modules/application-settings");
    • appSettings.getXXXX, appSettings.setXXXX, appSettings.hasKey, etc

その他・メモ

その他の方法

他にも、下記の方法やプラグインがある

参考文献

関連記事

この記事が参考になった方
ここかここからチャージや購入してくれると嬉しいです(ブログ主へのプレゼントではなく、ご自身へのチャージ)
欲しいもの / Wish list