使用distinctUntilChanged()函数过滤重复值
示例代码:
import { BehaviorSubject } from 'rxjs';
const behaviorSubject = new BehaviorSubject('initial value');
// 监听behaviorSubject
behaviorSubject.subscribe((value) => {
console.log(value);
});
// 修改behaviorSubject的值
behaviorSubject.next('new value');
behaviorSubject.next('new value'); // 重复的值
// 输出:
// initial value
// new value
在上面的示例中,behaviorSubject触发了两次,其中一次是重复的值。为了避免这种情况,我们可以使用distinctUntilChanged()
函数过滤掉重复值:
import { BehaviorSubject } from 'rxjs';
import { distinctUntilChanged } from 'rxjs/operators';
const behaviorSubject = new BehaviorSubject('initial value');
// 监听behaviorSubject
behaviorSubject.pipe(distinctUntilChanged()).subscribe((value) => {
console.log(value);
});
// 修改behaviorSubject的值
behaviorSubject.next('new value');
behaviorSubject.next('new value'); // 重复的值
// 输出:
// initial value
// new value
上面的代码中,我们使用了pipe()
函数和distinctUntilChanged()
操作符来过滤掉重复的值,这样就避免了BehaviorSubject触发多次的问题。