react-async-iterator
Iterate over an async iterable while component is mounted.
The AsyncIterator
component closely follows the semantics of the async iteration statement (for-await-of). Each yielded value will be passed to the initialProps.onYield
callback. If the component unmounts then it will not resume iteration after yielding.
Install
npm i react-async-iterator react --save
Example
./SearchArtists.js
with async generators
Async Generators are introduced in this tc39 proposal. It will be part of ES2018 and can be found on the list of finished proposals. You can use it today with babel-plugin-transform-async-generator.
;;; { const response = await ; const results = await response; artists: resultsartistsitems ;};
with generators
;;; // sync iterators can yield promises { ;};
with custom async iterables
You don't need async generators to create an async iterator. Learn more about async iterators and generators in this article by Jake Archibald.
;;; { let i = 0; return // async iteratables return promises that resolve to { value, done } async { } { return this; } ;};
with custom iterables
;;; { let i = 0; return { } { return this; } ;};
./App.js
;;; { this; } { this; }; { return <div> <input type="text" value=thisstateq onChange=thisonChange /> thisstateartists <LoadSearch q=thisstateq onYield= this key=thisstateq /> </div> ; }