[javascript] Riot.js에서 AJAX 요청을 처리하는 방법은 무엇인가요?

24 Nov 2023

javascript

아래는 Riot.js에서 AJAX 요청을 처리하는 예시 코드입니다.

<!DOCTYPE html>
<html lang="ko">
<head>
  <meta charset="UTF-8">
  <title>Riot.js AJAX 예시</title>
  <script src="https://cdn.jsdelivr.net/npm/riot@4.16.0/dist/riot.min.js"></script>
</head>
<body>
  <my-app></my-app>

  <script>
    riot.mount('my-app', {
      async makeRequest() {
        try {
          const response = await fetch('/api/data');
          const data = await response.json();
          console.log(data);
        } catch (error) {
          console.error('에러 발생:', error);
        }
      }
    });
  </script>
</body>
</html>

이 예시 코드에서 my-app이라는 컴포넌트를 정의하고 makeRequest 메서드를 작성했습니다. makeRequest 메서드에서는 fetch API를 사용하여 AJAX 요청을 보내고, 응답 데이터를 JSON 형식으로 읽어옵니다. 응답 데이터는 console.log를 통해 출력됩니다.

이 코드를 실행하면 웹 페이지가 로드될 때 makeRequest 메서드가 호출되어 AJAX 요청이 전송됩니다. 요청 성공 시 응답 데이터가 콘솔에 표시되고, 요청 오류 시 에러 메시지가 콘솔에 표시됩니다.

참고: Riot.js 버전 4.16.0을 사용하고 있는 예시 코드입니다. Riot.js 버전에 따라 문법이나 API가 변경될 수 있으므로, 사용하는 버전에 맞는 공식 문서를 참조하시기 바랍니다.