Skip to content

Instantly share code, notes, and snippets.

@samwx
Created January 15, 2019 01:55
Show Gist options
  • Save samwx/303a136baca4aac78ba6c568209b6604 to your computer and use it in GitHub Desktop.
Save samwx/303a136baca4aac78ba6c568209b6604 to your computer and use it in GitHub Desktop.
Example using react with channels
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import Channel from '@nodeguy/channel'
const ch = Channel()
export class Generators {
static async waitAndRetrieve() {
const r = await ch.shift()
console.log(r);
if(!r) {
console.log('promise already resolved');
}
}
static actionPromise() {
return new Promise(resolve => {
setTimeout(async () => {
resolve()
console.log('done!')
await ch.push('pushed to channel')
await ch.close()
}, 2000)
})
}
}
class MyComponent extends Component {
async componentDidMount() {
await Generators.waitAndRetrieve()
setTimeout(async () => {
await Generators.waitAndRetrieve()
}, 3000)
}
render() {
return <h1>I'm a child component</h1>
}
}
class App extends Component {
async componentDidMount() {
await Generators.actionPromise()
}
render() {
return (
<div className="App">
<header className="App-header">
<img src={logo} className="App-logo" alt="logo" />
<p>
Edit <code>src/App.js</code> and save to reload.
</p>
<a
className="App-link"
href="https://reactjs.org"
target="_blank"
rel="noopener noreferrer"
>
Learn React
</a>
</header>
<MyComponent />
</div>
);
}
}
export default App;
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment