为了账号安全,请及时绑定邮箱和手机立即绑定

Ionic 4事件不能在设备中工作,但在浏览器上工作

Ionic 4事件不能在设备中工作,但在浏览器上工作

UYOU 2022-09-23 17:12:33
我正在使用"@ionic/angular": "^4.11.10"我正在尝试根据是否发出事件来显示 中的选项卡。我有一个用于条件渲染。代码如下:ion-tabsion-tab-bar*ngIf<ion-tabs color="danger">    <ion-tab-bar class="tab-bar" slot="bottom">        <ion-tab-button *ngIf="!registerClicked" tab="tab1">            <ion-icon name="thumbs-up"></ion-icon>            <ion-label>{{'Transfer' | translate}}</ion-label>        </ion-tab-button>        <ion-tab-button tab="tab2">            <ion-icon name="gift"></ion-icon>            <ion-label>{{'Perks' | translate}}</ion-label>        </ion-tab-button>    </ion-tab-bar><ion-tabs>下面是事件发射器:import { Events } from '@ionic/angular';export class LoginModalPage   constructor(      public event:Events    ) { }  public login() {      this.event.publish('registerClicked', false);  }}同样,还有另一个函数将寄存器单击设置为 true:import { Events } from '@ionic/angular';export class RegisterModalPage   constructor(      public event:Events    ) { }  public register() {      this.event.publish('registerClicked', true);  }}并在选项卡的代码后面,import { Events } from '@ionic/angular';export class TabsPage {  public registerClicked:boolean;  constructor(    public event: Events  ) {    this.event.subscribe('registerClicked', (data) =>{      this.registerClicked = data;    });  }}现在,当我运行localhost:4200时,代码按预期工作,当按钮单击时调用登录函数时显示,当我单击执行该函数的按钮时,选项卡不可见。但是,当我构建apk并在设备上进行测试时,这不起作用。任何人都可以提供任何见解来实现这一目标吗?tab1register()
查看完整描述

1 回答

?
慕桂英546537

TA贡献1848条经验 获得超10个赞

为了将数据从一个页面更新到另一个页面,我们使用了事件库。但是事件在离子5中不再可用。打击是解决方案。运行命令:


ionic generate service events        // this will create events provider

复制粘贴吹塑代码。


import { Injectable } from '@angular/core';

import {Subject} from 'rxjs';


@Injectable({

  providedIn: 'root'

})

export class EventsService {


private fooSubject = new Subject<any>();


constructor() { }



    publishLogin(data: any) {

        this.fooSubject.next(data);

    }


    receiveLogin(): Subject<any> {

        return this.fooSubject;

    }

}

从页面 A:导入您的服务,在构造函数 // 中初始化它


constructor(public events: EventsService){}

并发布事件 例如


 this.events.publishLogin(yourDataVariable);

在页面 B 中接收它:导入您的服务,在构造函数 // 中初始化它


    constructor(public events: EventsService){}


this.events.receiveLogin().subscribe((res:any)=>{

        console.log(res);

      })


查看完整回答
反对 回复 2022-09-23
  • 1 回答
  • 0 关注
  • 88 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信