我正在寻找一种方法,每当有人在实现Observable的给定类的实例上调用subscribe时,就执行回调.

在RxJS库中没有钩子的情况下,在几乎任何其他面向对象语言中,我会:

  • 继承我想要定制的类(本例中为ReplaySubject);
  • 覆盖subscribe方法;以及
  • 执行我的回调,然后将调用委托给超类‘subscribe方法.

大概是这样的:

export class CallbackReplaySubject<T> extends ReplaySubject<T> {

  subscribe(observer: Partial<Observer<T>>): Unsubscribable {
    this.triggerCallback();
    return super.subscribe(observer);
  }

  private triggerCallback(): void {
    // do something when someone subscribes
  }
}

在使用TypeScrip的RxJS v7中,我收到以下错误消息:

Property 'subscribe' in type 'CallbackReplaySubject<T>' is not assignable to the same property in base type 'ReplaySubject<T>'.
  Type '(observer: Partial<Observer<T>>) => Unsubscribable' is not assignable to type '{ (observerOrNext?: Partial<Observer<T>> | ((value: T) => void) | undefined): Subscription; (next?: ((value: T) => void) | null | undefined, error?: ((error: any) => void) | ... 1 more ... | undefined, complete?: (() => void) | ... 1 more ... | undefined): Subscription; }'.
    Type 'Unsubscribable' is missing the following properties from type 'Subscription': closed, _parentage, _finalizers, add, and 4 more.

我越深入地研究这一点,就越会接触到被标记为内部的"带下划线的"RxJS方法,它们喊着"请勿使用!"在我身上,阻止任何定制.

因此,我try 了委托模式,而不是继承.这也行不通,因为Observable不是一个接口,而是一个类.因此,我又一次被这些"带下划线"的内部方法和成员缠住了.

有谁能告诉我一条出路吗?

直到包括RxJSV6,我都能够通过继承来解决这个问题,继承了ReplaySubject‘S内部的_subscribe方法.

推荐答案

在RxJSv7中,该库不再直接使用类.您可以创建一个增强可观测对象的函数,创建一个更高阶的函数,该函数接受一个可观测对象并用您的自定义行为返回一个新的可观测对象.

import { Observable, Observer, PartialObserver, ReplaySubject, Unsubscribable } from 'rxjs';

function withSubscribeCallback<T>(source: Observable<T>, callback: () => void): Observable<T> {
  return new Observable<T>((observer: Observer<T>) => {
    callback(); // Your callback logic here
    const subscription = source.subscribe(observer);

    return subscription;
  });
}

// Example usage
const originalObservable = new ReplaySubject<number>();

const enhancedObservable = withSubscribeCallback(originalObservable, () => {
  console.log('Subscribed!');
});

enhancedObservable.subscribe(value => {
  console.log('Received:', value);
});

Typescript相关问答推荐

如何在ts中使用函数重载推断参数类型

在这种情况下,如何获得类型安全函数的返回值?

react 路由6操作未订阅从react 挂钩表单提交+也不使用RTK查询Mutations

STypescript 件的标引签名与功能签名的区别

如何在另一个参数类型中获取一个参数字段的类型?

角效用函数的类型推断

Cypress页面对象模型模式.扩展Elements属性

如何将v-for中的迭代器编写为v-if中的字符串?

(TypeScript)TypeError:无法读取未定义的属性(正在读取映射)"

为什么我在这个重载函数中需要`as any`?

如何过滤文字中的类对象联合类型?

TypeScrip错误:为循环中的对象属性赋值

如何创建由空格连接的多个字符串的类型

如何键入并类型的函数&S各属性

类型判断数组或对象的isEmpty

我的类型谓词函数不能像我预期的那样工作.需要帮助了解原因

什么';是并类型A|B的点,其中B是A的子类?

如何避免TS2322;类型any不可分配给类型never;使用索引访问时

将对象数组传递给 Typescript 中的导入函数

带有 Select 器和映射器的Typescript 泛型