react-native-storage + AsyncStorage 實現數據存儲

1.組件封裝

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

const SPStorage = new Storage({
  // 最大容量，默認值1000條數據循環存儲
  size: 1000,
  // 存儲引擎：RN使用AsyncStorage
  // 如果不指定則數據只會保存在內存中，重啟后即丟失
  storageBackend: AsyncStorage,
  // 數據過期時間，默認一整天（1000 * 3600 * 24 毫秒），設為null則永不過期
  defaultExpires: null,
  // 讀寫時在內存中緩存數據，默認開啟
  enableCache: true,
  // 如果storage中沒有相應數據，或數據已過期，
  // 則會調用相應的sync方法，無縫返回最新數據。
  // sync方法的具體說明會在后文提到
  // 你可以在構造函數這里就寫好sync的方法
  // 或是在任何時候，直接對storage.sync進行賦值修改
  // 或是寫到另一個文件里，這里require引入
  sync: {}
});

// global.storage = storage1
// export default storage;

const SPSaveLoginInfo = (phone, password) => {
  // 刪除單個數據
  // SPStorage.remove({
  //   key: 'loginState'
  // });
  console.log('phone: ',phone);
  console.log('password: ',password);

  SPStorage.save({
    key: 'loginState',  // 注意:請不要在key中使用_下划線符號!
    data: {
      phone: phone,
      // password: password,
    },
    // 如果不指定過期時間，則會使用defaultExpires參數
    // 如果設為null，則永不過期
    // expires: 1000 * 3600
    expires: null
  });
}

// 讀取
const SPReadLoginInfo = () => {
  return new Promise((resolve, reject) => {
    SPStorage.load({
      key: 'loginState',
      // autoSync(默認為true)意味着在沒有找到數據或數據過期時自動調用相應的sync方法
      autoSync: true,
      // syncInBackground(默認為true)意味着如果數據過期，
      // 在調用sync方法的同時先返回已經過期的數據。
      // 設置為false的話，則始終強制返回sync方法提供的最新數據(當然會需要更多等待時間)。
      syncInBackground: true
    }).then(ret => {
      // 如果找到數據，則在then方法中返回
      // 注意：這是異步返回的結果（不了解異步請自行搜索學習）
      // 你只能在then這個方法內繼續處理ret數據
      // 而不能在then以外處理
      // 也沒有辦法“變成”同步返回
      // 你也可以使用“看似”同步的async/await語法
      resolve(ret);
    }).catch(err => {
      //如果沒有找到數據且沒有sync方法，
      //或者有其他異常，則在catch中返回
      console.log(err);
      reject(err);
    })
  })
}

const saveFirstLogin = () => {
  // 存儲方法
  SPStorage.save({
    key: 'isFirstLogin',  // 注意:請不要在key中使用_下划線符號!
    data: {
      isFirstLogin: true,
      loginDate: new Date()
    },

    // 如果不指定過期時間，則會使用defaultExpires參數
    // 如果設為null，則永不過期
    // expires: 24*60*60*1000
    // expires: 60 * 60 * 1000,      //一個小時
    expires: 7*24*60*60*1000      //一個禮拜
    // expires: 1000         //1秒
  });
};

const isFirstLogin = () => {
  return new Promise((resolve, reject)=> {
    // 讀取方法
    SPStorage.load({
      key: 'isFirstLogin',
      // autoSync(默認為true)意味着在沒有找到數據或數據過期時自動調用相應的sync方法
      autoSync: true,
      syncInBackground: true,
      // 你還可以給sync方法傳遞額外的參數
      syncParams: {
        extraFetchOptions: {
          // 各種參數
        },
        someFlag: true,
      },
    }).then(res => {
      console.log(res);
      resolve(false);
    }).catch(err => {
      resolve(true);
      reject(err);
      console.log(err);
    })
  })
};


export {
  SPStorage,
  SPSaveLoginInfo,
  SPReadLoginInfo,
  saveFirstLogin,
  isFirstLogin
};

.