Question

我目前正在使用Cycle.js，我正在尝试在提交表单时获取文本输入的流。例如：

const textChange$ = DOMSource.select('input').events('change');
const textValueSubmit$ = DOMSource.select('form').events('submit')
    .do(ev => ev.preventDefault());

我认为我需要在此时合并流，但我只关心最新的文本值（当用户提交表单时）。处理这种情况的适当方法是什么？

Answer 1

你也可以使用sample()来避免创建额外的功能，我相信这是你正在寻找的功能

const textChange$ = DOMSource.select('input').events('change')
  .pluck('target', 'value')
const submit$ = DOMSource.select('form').event('submit')
  .do(ev => ev.preventDefault)
const textValueSubmit$ = textChange$.sample(submit$)

Answer 2

添加到当前答案，您还可以使用withLatestFrom。请注意，combineLatest和withLatestFrom语义在细微点上有所不同：

combineLatest将在其中一个组合源发出值时发出一个值（只要每个源可观察序列发出至少一个元素）
withLatestFrom仅在合并源发出值

所以你可以这样做：

const textChange$ = DOMSource.select('input').events('change')
  .pluck('target', 'value')
const submit$ = DOMSource.select('form').event('submit')
  .do(ev => ev.preventDefault)
const textValueSubmit$ = submit$.withLatestFrom(textChange$, function (submit, textChange){...});

即使这不包括超过您的特定用例（这里您不关心提交事件传递的值，因此建议sample也可以正常工作），它仍然是很好地将这两个操作符记在另一个类似的未来用例中。

最后，combineLatest在这种情况下真的适合你吗？每次textValueSubmit$发射时，您似乎都会发出textChange$次发射。这是预期的行为吗？

RxJS如何将流映射到最新的不同流？

2 个答案: