위 코드에 async를 적용하면 어떨까요?

App.js

import React, { useState } from 'react';
import axios from 'axios';
 
const App = () => {
  const [data, setData] = useState(null);
  const onClick = async () => {
    try {
      const response = await axios.get(
        'https://jsonplaceholder.typicode.com/todos/1',
      );
      setData(response.data);
    } catch (e) {
      console.log(e);
    }
  };
  return (
    <div>
      <div>
        <button onClick={onClick}>불러오기</button>
      </div>
      {data && <textarea rows={7} value={JSON.stringify(data, null, 2)} readOnly={true} />}
    </div>
  );
};
 
export default App;

---

 

화살표 함수에 async/await를 적용할 때는 async () => {}와 같은 형식으로 적용합니다. 불러오기 버튼을 눌렀을 때 이전과 똑같이 데이터가 잘 불려 오나요?