서버 데이터 요청 (ajax - axios)

서버야 웹툰 줘

 

1. 방법(GET/POST)

2. 어떤자료(URL)

보내달라

 

데이터를 받을 때에는 GET

데이터를 줄 때에는 POST

 

ajax중 라이브러리 axios를 사용하겠다.

npm install axios

터미널에 입력해서 인스톨 받아준다.

 

app.js 상단에 추가

import axios from 'axios';

 

사용방법

            <button onClick={()=>{
              //axios 사용
              axios.get('https://codingapple1.github.io/shop/data2.json').then((result)=>{
              
              let data = result.data;
              let copy = [...shoes,...data]; //기본 배열에 추가하는 방법

              setShoes(copy);
             })

            }}>버튼</button>

 

그 외에 Post 등의 요청

            <button onClick={()=>{
              //axios 사용
              
              axios.get('https://codingapple1.github.io/shop/data2.json').then((result)=>{
              
              let data = result.data;
              let copy = [...shoes,...data]; //기본 배열에 추가하는 방법

              setShoes(copy);
             })
            
             Promise.all(axios.post('/test'),axios.post('/test')).then(()=>{}); // 두개 이상의 get요청일 경우
             axios.post('/test',{name : 'kim'}); // post 요청과 파라미터 보내기

            }}>버튼</button>
          </div>