Question

使用rxjs @ 5，我们实现了一个方便的DisposeBag类来收集订阅，并使销毁Angular组件时更容易取消订阅。

import { Subscription } from "rxjs/Subscription";

export class DisposeBag {
    private _subscription: Subscription[] = [];

    insert(subscription: Subscription): void {
        this._subscription.push(subscription);
    }

    dispose() {
        this._subscription.forEach(subscription => {
            subscription.unsubscribe();
        });
        this._subscription = [];
    }
}

export function disposedBy(this: Subscription, bag: DisposeBag): void {
    bag.insert(this);
}

Subscription.prototype.disposedBy = disposedBy;

declare module "rxjs/Subscription" {
    interface Subscription {
        disposedBy: typeof disposedBy;
    }
}

升级到rxjs @ 6 + rxjs-compat @ 6，我们会遇到以下编译错误：

(12) Property 'unsubscribe' does not exist on type 'Subscription'. (22) 'Subscription' only refers to a type, but is being used as a value here.

将第一个导入切换为

import { Subscription } from "rxjs";

解决了两个错误，但引入了(22) Property 'disposedBy' does not exist on type 'Subscription'.错误。

我们如何解决这个问题？

Answer 1

感谢this的回答，我得以将其解决如下：

import { Subscription } from "rxjs";

export class DisposeBag {
    private _subscription: Subscription[] = [];

    insert(subscription: Subscription): void {
        this._subscription.push(subscription);
    }

    dispose() {
        this._subscription.forEach(subscription => {
            subscription.unsubscribe();
        });
        this._subscription = [];
    }
}

export function disposedBy(this: Subscription, bag: DisposeBag): void {
    bag.insert(this);
}

Subscription.prototype.disposedBy = disposedBy;

declare module "rxjs/internal/Subscription" {
    interface Subscription {
        disposedBy: typeof disposedBy;
    }
}

向RxJs 6订阅原型添加方法

1 个答案: