Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
import React, {
Component,
unstable_ConcurrentMode as ConcurrentMode,
unstable_Suspense as Suspense,
} from 'react'
import { createFetcher } from './cache';
import logo from './logo.svg'
import './App.css'
const URL = 'https://gist.githubusercontent.com/wtfaremyinitials/c7fe964ee2ee2937c0dfaf90dec27f82/raw/9a1f3a31cec8d5250fc8d0c99b152f6054e98aef/foo.json'
const DataFetcher = createFetcher(() => fetch(URL).then(r => r.json()));
function Greeting() {
const { message } = DataFetcher.read();
return <p>{message}</p>
}
class App extends Component {
render() {
return (
<ConcurrentMode>
<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>
<Suspense
maxDuration={1000}
fallback={'Loading...'}
>
<Greeting />
</Suspense>
</header>
</div>
</ConcurrentMode>
)
}
}
export default App
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.