0 added
0 removed
Original
2026-01-01
Modified
2026-02-21
1
<p>Working with asynchronous code in React is not particularly remarkable compared to what we previously discussed in the<a>Asynchronous Programming</a>course. But it does not hurt to run through it again.</p>
1
<p>Working with asynchronous code in React is not particularly remarkable compared to what we previously discussed in the<a>Asynchronous Programming</a>course. But it does not hurt to run through it again.</p>
2
class Loader extends React.Component { constructor(props) { super(props); this.state = { url: null }; } handleClick = async () => { const res = await axios.get('/images/random'); this.setState({ url: res.data }); } render() { const { url } = this.state; return ( <div> <button onClick={this.handleClick}>Load Random Image</button> {url && <img src={url} />} </div> ); } }<p>As you can see above, we can easily make the handler asynchronous, and everything else will be okay.</p>
2
class Loader extends React.Component { constructor(props) { super(props); this.state = { url: null }; } handleClick = async () => { const res = await axios.get('/images/random'); this.setState({ url: res.data }); } render() { const { url } = this.state; return ( <div> <button onClick={this.handleClick}>Load Random Image</button> {url && <img src={url} />} </div> ); } }<p>As you can see above, we can easily make the handler asynchronous, and everything else will be okay.</p>