离子存储在 Chrome 浏览器中不起作用

Question

我是 Ionic 应用程序开发的新手，我一直在学习相同的教程。

我一直在尝试使用IonicStorageModule，但即使在 chrome 浏览器移动视图模式下运行应用程序时没有错误，也不会生成本地存储密钥。

在我的app.module.ts，我有

import { IonicStorageModule } from '@ionic/storage';

然后我在imports数组中有以下导入，

  imports: [
    BrowserModule,
    HttpModule,
    IonicModule.forRoot(MyApp),
    IonicStorageModule.forRoot()
  ],

现在，我创建了一个服务，命名为user-settings.service.ts，

import { Injectable } from '@angular/core';
import { Storage } from '@ionic/storage';

@Injectable()
export class UserSettings {
    constructor(private storage:Storage){}

    favoriteTeam(team,tournamentId, tournamentName) {
        debugger;
        let item = { team: team,tournamentId : tournamentId, tournamentName : tournamentName};
        this.storage.set('teamId' , item);
    }

    unFavoriteTeam(team) {
        this.storage.remove(team.id);
    }

    isFavoriteTeam(team) {
        return this.storage.get(team.id).then(value => value ? true : false);
    }
}

当我这样做时，从我的组件类中......

}else {
  this.isFollowing = true;
  this.userSettings.favoriteTeam(this.team,this.currentTournamentData.tournament.id,this.currentTournamentData.tournament.name);
}

即使服务被击中，我也看不到在 chrome application -> storage -> local storage. 中创建 local stoarge 键

我做错了什么？

Answer 1

就像您在 the docs 中看到的那样：

当在 Web 中运行或作为 Progressive Web App 运行时，Storage 将 尝试按顺序使用 IndexedDB、WebSQL 和 localstorage。

因此，如果您使用的是 Chrome，请先检查数据是存储在 IndexedDB 还是 WebSQL 中：

另外请注意，您正在使用teamId 键设置数据，如下所示：

this.storage.set('teamId' , item);

因此，为了取回该数据，您需要使用相同的密钥：

this.storage.get('teamId').then(value => value ? true : false);

如果你想从存储中删除它也是一样的：

this.storage.remove('teamId');