RxJS中能否用Subject搭配takeUntil取消fromEvent订阅及TS报错处理

• 核心原因是takeUntil操作符导入路径错误：RxJS v6及以上版本中，管道操作符需要从rxjs/operators路径导入，如果误从rxjs根路径导入takeUntil，得到的是一个用于创建Observable的方法，而非管道操作符，传入pipe方法时自然会出现类型不匹配的TS2345错误。
• 次要原因为Subject泛型定义缺失：未显式指定_closed$的泛型类型也可能触发额外的类型校验错误。

步骤1：修正takeUntil导入路径 #

// 正确导入方式
import { takeUntil } from 'rxjs/operators';
// 错误导入方式（不要这么写）
// import { takeUntil } from 'rxjs';

步骤2：补全Subject泛型定义（推荐） #

你可以根据业务需要选择显式指定布尔类型或者无值类型：

import { Subject } from 'rxjs';
import { takeUntil } from 'rxjs/operators';
import { fromEvent } from 'rxjs';

// 写法1：保留布尔类型
private _closed$: Subject<boolean> = new Subject<boolean>();

// 写法2：如果不需要传递关闭参数，用void类型更简洁
// private _closed$: Subject<void> = new Subject<void>();

fromEvent(document, 'mousedown')
  .pipe(takeUntil(this._closed$))
  .subscribe(event => {
    // 你的业务逻辑
  });

需要取消订阅时，执行以下任意一行代码即可：

// 如果是boolean类型Subject
this._closed$.next(true);
// 如果是void类型Subject
// this._closed$.next();

// 也可以直接调用complete，效果一致
this._closed$.complete();

内容的提问来源于stack exchange，提问作者Deka Thomas