ionic3基礎之本地緩存

原創

2020-02-21 04:51

storage本地緩存

之前的版本需要在app.module.ts 文件引入 import { Storage} from ‘@ionic/storage’; 並在providers中寫入Storage.
-在xx.ts文件中需要引入import { Storage} from ‘@ionic/storage’;並在組件中注入providers :[
Storage
]纔可以使用。

import { Storage } from '@ionic/storage';//這引入
@Component({
  selector: 'page-home',
  templateUrl: 'home.html',
  providers :[//這需要引入
  Storage
]
})
export class HomePage {
 constructor(public navCtrl: NavController
          public modalCtrl: ModalController,
          public storage: Storage) {//這引入
}


//這是app.module.ts文件
import { Storage } from '@ionic/storage';//這引入
//...
@NgModule({
  declarations: [
  MyApp,
  HomePage,
],
imports: [
  IonicModule.forRoot(MyApp),
  HttpModule
],
bootstrap: [IonicApp],
  entryComponents: [
  MyApp,
  HomePage,
],
providers: [
  Storage,//這引入
  //.......
  {provide: ErrorHandler, useClass: IonicErrorHandler}
]
})
export class AppModule {}

storage2.0.0之後改變。
需要安裝storage2.0.0版本
- npm install @ionic/[email protected] –save
在app.module.ts中刪除storage
import { IonicStorageModule } from ‘@ionic/storage’而不是import { IonicStorage } from ‘@ionic/storage’在app.module.ts中
添加IonicStorageModule.forRoot()到其中的imports數組app.module.ts
xx.ts 文件必須刪除@Component()中的 providers :[
Storage] 其他不變

//app.module.ts  
import { IonicStorageModule } from '@ionic/storage';//導入換成這個

//..
@ngModule({

imports: [
  IonicModule.forRoot(MyApp),
  HttpModule,
  IonicStorageModule.forRoot(),//這需要添加 之前providers裏的需要刪除
]

//xx.ts
import { Storage } from '@ionic/storage';
@Component({
  templateUrl: 'Myapp.html',
})
export class MyApp {
  constructor(private storage: Storage) { }
  ...
  // set a key/value
  storage.set('name', 'Max');

  // Or to get a key/value pair
  storage.get('age').then((val) => {
    console.log('Your age is', val);
  });
}