Categories: RxJS教程

RxJS:转换运算符buffer

缓冲区对可观察对象进行操作,并将参数作为可观察对象。它将开始对数组中其原始可观察对象发出的值进行缓冲,并在将可观察对象作为参数发出时发出相同的值。一旦将作为对象的observable发出,则重置缓冲区并再次开始对原始缓冲区进行缓冲,直到输入observable发出并且重复相同的场景为止。

语法

buffer(input_observable: Observable): Observable

参量

input_observable-将使缓冲区发出值的可观察值。例如,单击按钮。

返回值

将返回一个observable,它将具有一个缓冲值数组。我们将通过一个示例来了解buffer()运算符的工作原理。

在下面的示例中,我们将使用按钮单击作为可观察的输入进行缓冲。1s的间隔将与原始可观察到的调用缓冲区有关。缓冲区将收集在给定时间间隔内传递的点击次数。

import { fromEvent, interval } from 'rxjs';
import { buffer } from 'rxjs/operators';

let btn = document.getElementById("btnclick");

let btn_clicks = fromEvent(btn, 'click');
let interval_events = interval(1000);
let buffered_array = interval_events.pipe(buffer(btn_clicks));
buffered_array.subscribe(arr => console.log(arr));

输出

terry

这个人很懒,什么都没有留下~

Share
Published by
terry

Recent Posts

自定义指令:聊聊vue中的自定义指令应用法则

今天我们来聊聊vue中的自定义…

18 小时 ago

聊聊Vue中@click.stop和@click.prevent

一起来学下聊聊Vue中@cli…

1 周 ago

Nginx 基本操作:启动、停止、重启命令。

我们来学习Nginx基础操作:…

1 周 ago

Vue3:手动清理keep-alive组件缓存的方法

Vue3中手动清理keep-a…

2 周 ago

聊聊React和Vue组件更新的实现及区别

React 和 Vue 都是当…

3 周 ago