RxJS:我如何 event.preventDefault(） 一个丢弃事件

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

本文关键字：一个 事件 event preventDefault RxJS      更新时间：2023-09-26

我的标记：

<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回调吗？我需要preventDefault s 进行drop和dragover以防止浏览器打开文件。

您只需要订阅您的map流。 map所做的只是创建一个新的可观察量，该可观察量将在流上运行map操作。 但是您仍然需要订阅才能使其执行某些操作：

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