Redux-ObservableでRxJS-RxJS-DOMを使用することはできます

Question

Redux-ObservableはRxJSに依存しています。

RxJS-DOMのfilereader関数を使用する必要があります。

https://github.com/Reactive-Extensions/RxJS-DOM/blob/master/doc/operators/filereader.md

RxJS-DOMはRxJS（プラスDOMのもの）などのAPIの同じ基本セットが含まれているように見えます。

Redux-ObservableにRxJSではなくRxJS-DOMを使用することはできますか？両方をインポートすると、ビルドのサイズが膨大になります。

Answer 1

RxJS-DOM aka rx-domはv5 +ではなくRxJS v4用です。 2つはと互換性がありませんです。状況は本当に混乱しています。

• これは、以下のRxJS V4であると：https://www.npmjs.com/package/rx
• これはRxJSのV5 +である：V5でhttps://www.npmjs.com/package/rxjs

+ fromReaderへの同等の公式は存在しないが、ここでの問題チケットの追跡です：https://github.com/ReactiveX/rxjs/issues/1223

おそらくあなたが聞きたいものではありませんが、他のAPIの周りにカスタムObservableラッパーを作成するはかなり簡単です Observablesが根本的にどのように機能するかを理解しています。これは非常に貴重なスキルです。

fromReaderは、FileReaderを提供していないため、実際には誤った名前で、Fileを提供し、内部的にそれを排除するために独自のFileReaderを作成します。代わりにfromFileとしましょう。それはあなたがしたいすべてのファイルを読み込み、ロード/エラーを処理した場合、あなたが代わりに作成することができ、匿名の複雑なAPIと、このような、より柔軟な方法ですが

class FromFileAsTextObservable extends Observable { 
    constructor(file, encoding) { 
    super(); 

    this.file = file; 
    this.encoding = encoding; 
    } 

    _subscribe(subscriber) { 
    const reader = new FileReader(); 

    const loadHandler = event => { 
     subscriber.next(event.target.result); 
     subscriber.complete(); 
    }; 

    const errorHandler = event => { 
     subscriber.error(event.target.error); 
    }; 

    reader.addEventListener('load', loadHandler, false); 
    reader.addEventListener('error', errorHandler, false); 

    reader.readAsText(this.file, this.encoding); 

    return() => { 
     reader.removeEventListener('load', loadHandler, false); 
     reader.removeEventListener('error', errorHandler, false); 
    }; 
    } 
} 

class FromFileFactory { 
    constructor(file) { 
    this.file = file; 
    } 

    asText(encoding) { 
    return new FromFileAsTextObservable(this.file, encoding); 
    } 
} 

const fromFile = file => 
    new FromFileFactory(file); 

const file = new File(['hello world'], 'example.txt', { 
    type: 'text/plain', 
}); 

fromFile(file).asText() 
    .subscribe(text => console.log(text)); 

：これは非常に基本的な出発点の一例です彼らは、他のRXため（https://redux-observable.js.org/docs/FAQ.html#general-rxjs-v4）アダプタを書き込む手順]を持っていると主張

const fromFileAsText = (file, encoding) => new Observable(subscriber => { 
    const reader = new FileReader(); 

    const loadHandler = event => { 
    subscriber.next(event.target.result); 
    subscriber.complete(); 
    }; 

    const errorHandler = event => { 
    subscriber.error(event.target.error); 
    }; 

    reader.addEventListener('load', loadHandler, false); 
    reader.addEventListener('error', errorHandler, false); 

    reader.readAsText(file, encoding); 

    return() => { 
    reader.removeEventListener('load', loadHandler, false); 
    reader.removeEventListener('error', errorHandler, false); 
    }; 
}); 

const file = new File(['hello world'], 'example.txt', { 
    type: 'text/plain', 
}); 

fromFileAsText(file) 
    .subscribe(text => console.log(text));