@cycle/fetch
v4.0.0
Published
A Cycle.js Driver for making HTTP requests through fetch
Downloads
8
Readme
Cycle Fetch Driver
A Cycle.js Driver for making HTTP requests, using the Fetch API.
Install
npm install @cycle/fetch
API
makeFetchDriver(scheduler: Scheduler) -> fetchDriver: function
Factory that returns a fetch driver. It takes an optional scheduler
argument to pass into fromPromise
.
Usage
Basics:
import 'whatwg-fetch' // polyfill if you want to support older browsers
import Cycle from '@cycle/core';
import { makeFetchDriver } from 'cycle-fetch-driver';
function main(responses) {
// ...
}
const drivers = {
Fetch: makeFetchDriver()
}
Cycle.run(main, drivers);
Simple and normal use case:
function main(responses) {
const HELLO_URL = 'http://localhost:8080/hello';
let request$ = Rx.Observable.just(HELLO_URL);
let vtree$ = responses.Fetch
.byUrl(HELLO_URL)
.mergeAll()
.flatMap(res => res.text()) // We expect this to be "Hello World"
.startWith('Loading...')
.map(text =>
h('div.container', [
h('h1', text)
])
);
return {
DOM: vtree$,
Fetch: request$
};
}
Select all the responses for a certain key:
function main(responses) {
const HELLO_URL = 'http://localhost:8080/hello';
let request$ = Rx.Observable.just({
key: 'hello',
url: HELLO_URL
});
let vtree$ = responses.Fetch
.byKey('hello')
.mergeAll()
.flatMap(res => res.text()) // We expect this to be "Hello World"
.startWith('Loading...')
.map(text =>
h('div.container', [
h('h1', text)
])
);
return {
DOM: vtree$,
Fetch: request$
};
}