离子原生存储错误答案

【问题标题】：Ionic NativeStorage error离子原生存储错误
【发布时间】：2017-12-09 18:46:16
【问题描述】：

我正在尝试在我的应用程序中使用 nativestorage (https://github.com/TheCocoaProject/cordova-plugin-nativestorage)。

一切都很好，我可以构建应用程序了。

在我的app.components.ts 我有这个

this.setRootPage();

在this.platform.ready().then(()的末尾

哪个调用函数

setRootPage() {

 //intro skip if value is set

  this.nativeStorage.getItem("intro").then((intro) => {
  if (intro) {
    this.rootPage = Category1Page;
  } else {
    this.rootPage = IntroPage;
  }
});

  }

在 IOS 模拟器和使用 ionic cordova run browser 的浏览器上运行应用程序 Error: Uncaught (in promise): [object Object] 时出现错误

非常感谢您的帮助

离子信息

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.12.0
    ionic (Ionic CLI) : 3.12.0

global packages:

    cordova (Cordova CLI) : 7.0.1 

local packages:

    @ionic/app-scripts : 1.3.7
    Cordova Platforms  : android 6.2.3 browser 4.1.0 ios 4.4.0
    Ionic Framework    : ionic-angular 3.3.0

System:

    ios-deploy : 1.9.2 
    Node       : v6.11.2
    npm        : 3.10.10 
    OS         : macOS High Sierra
    Xcode      : Xcode 9.0 Build version 9A235 

Misc:

    backend : pro

【问题讨论】：

标签： ios cordova ionic-framework

【解决方案1】：

我认为您不能只动态更改rootPage 变量来设置NavController 的根。首先确保rootPage 有一个初始值（可能是一个空的页面）。然后要在app.component 中使用NavController，您必须在ion-nav 模板中添加一个模板变量：

<ion-nav #Nav [root]="rootPage"></ion-nav>

并使用ViewChild添加引用：

@ViewChild('Nav') nav: NavController;

然后你可以修改你的setRootPage函数如下：

this.nativeStorage.getItem("intro").then((intro) => {
  if (intro) {
    this.nav.setRoot(Category1Page);
  } else {
    this.nav.setRoot(IntroPage);
  }
}, (error) => {
  this.nav.setRoot(IntroPage);
});

【讨论】：

照你说的做了。现在错误“错误：未捕获（承诺）：[object Object]”没有显示。但是，只是一个空白的白页，控制台中没有错误或异常...
我忘了添加错误回调，请参阅我更新的答案 :-) 如果未找到密钥 intro，则会调用错误回调。
感谢大卫的帮助。我将添加一些我必须做的额外修复，以使其全部正常工作并避免白屏死机。谢谢你！
而不是“this.nav.setRoot(Category1Page);”我不得不使用“this.rootPage = Category1Page;”

【解决方案2】：

非常感谢 David 为我指明了正确的方向。与往常一样，我喜欢将完整的解决方案放在我的问题末尾，以帮助可能面临类似问题的其他人:)

问题是设置/检索介绍页面（滑块）的值，并根据来自 nativestorage 的值动态发送用户。

在 app.html 中

<ion-nav #Nav [root]="rootPage"></ion-nav>

在 app.module.ts 中

import { Category1Page } from '../pages/layout/app1/category1/category1';
import { IntroPage } from '../pages/layout/intro/intro';

@NgModule({
  declarations: [
    ...
    Category1Page,
    IntroPage,
    ...

  ],
....
entryComponents: [
    ...
    Category1Page,
    IntroPage,
    ...
  ],

在 app.components.ts 中

import { Category1Page } from '../pages/layout/app1/category1/category1';
import { IntroPage } from '../pages/layout/intro/intro';

@Component({
  templateUrl: 'app.html'
})

export class MyApp {

  public rootPage: any;

...
constructor(... private nativeStorage: NativeStorage ...)
...

initializeApp() {
    this.platform.ready().then(() => {
      ...

      this.splashScreen.hide();

      this.setRootPage();
    });
  }

  setRootPage() {

  this.nativeStorage.getItem("intro").then((intro) => {
  if (intro) {
    this.rootPage = Category1Page;
  } else {
    this.rootPage = IntroPage;
  }
}, (error) => {
  this.rootPage = IntroPage;
});

  }

【讨论】：