LoginSignup
2
2

More than 3 years have passed since last update.

react-native-storageで保存したデータのメソッドが使えなくなる件

Posted at

概要

react-native-storageというAsyncStorageをラップしたライブラリがあります。
端末内にデータを保持させられるナイスなライブラリなのですが、使用中にちょっとハマったので備忘として。

事象

一度保存したデータを読み込んでみると、諸々のメソッドが使えなくなってしまう模様。
例えば下記の例はDate型で端末に保存されていたdateを読み込んだ時の処理

import Storage from 'react-native-storage';
import {AsyncStorage} from 'react-native';

const storage = new Storage({
    storageBackend : AsyncStorage,
    defaultExpires: null,
});

let date = new Date();

storage.load({key: 'DATE'}).then((data) => {
    date = data;
}).catch((error) => {
    // 読み込みエラー処理
});

// Date型のメソッドが使用できない
date.getTime(); // --> date.getTime is not a function...

考察

同様の事象にあたった人がいないか調べてみるが、なかなか引っかかってこない。
でもなんとなく原因は推察できた。
react-native-storageはAsyncStorageをラップしているので、保存されるデータは実際には文字列(というかJSON)で保持されているのではないか?

というわけで先ほどのソースをちょろっと修正

let date = new Date();

storage.load({key: 'DATE'}).then((data) => {
    // dataから新たにDateインスタンスを作成してみる
    date = new Date(data);
}).catch((error) => {
    // 読み込みエラー処理
});

date.getTime(); // --> OK!!

動いた!

まとめ

新規にインスタンスを作成するという処理をワンクッション挟めば問題なく動作することが分かった。
react-native-storageはホントに使いやすくて便利なので、是非とも使ってみてください。

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2