RxJS:我如何 event.preventDefault() 放置事件?

RxJS: How can I event.preventDefault() a drop event?

我的标记:

<section id="drop-target">
  Drop file here...
</section>

我的代码:

var dropTarget = document.getElementById('drop-target');

Rx.Observable.fromEvent(dropTarget, 'dragover').subscribe(function(event) {
  event.preventDefault();
});

var dropStream = Rx.Observable.fromEvent(dropTarget, 'drop');

dropStream.subscribe(function(event) {
  console.log('This will be called.');
  event.preventDefault();
});

dropStream.map(function(event) {
  console.log('This will not be called.');
  return event.dataTransfer.files[0].path;
});

知道如何调用我的最后一个 map 回调吗? dropdragover 都需要 preventDefault 来防止浏览器打开文件。

您只需要订阅您的 map 流。 map 所做的只是创建一个新的可观察对象,它将 运行 流上的 map 操作。但是你仍然需要订阅才能让它做一些事情:

dropStream
    .map(function (event) {
        console.log("hello");
        return event.dataTransfer.files[0].path;
    })
    .subscribe(function (path) {
        console.log("path=" + path);
    });