angular EventEmitter事件驱动通讯

ionic4.x 中使用 EventEmitter 事件驱动实现页面通讯

1. Eventemitter Github 地址:

https://github.com/primus/eventemitter3

2、安装配置 EventEmitter:

npm install --save eventemitter3

3、定义公共的服务配置 EventEmitter:

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

@Injectable()
export class EventService {
    public eventEmit: any;

    constructor() {
        // 定义发射事件
        this.eventEmit = new EventEmitter();
    }
}

4、用户中心页面监听事件广播:

import { EventService } from '../services/event.service';
    
this.eventService.eventEmit.on('login', (result) => {
    console.log('执行');
    // 这里面执行要初始化的东西
    if (userInfo && userInfo.username) {
        this.userInfo = userInfo;
    } else {
        this.userInfo = null;
    }
});

5、登录页面返回的时候发送广播:

import { EventService } from '../services/event.service';
ionViewDidLeave() {
    this.eventService.eventEmit.emit('login', '登录页面退出了');
}

posted on 2021-10-26 21:53  完美前端  阅读(234)  评论(0)    收藏  举报

导航