REACT

REACT_AxiosPost

ssmm95 2024. 9. 24. 15:01

AxiosPost 

: axios로 post 방식의 호출을 하는 문법은 get 방식으로 호출했을 때와 거의 동일하다

다른 점은 post함수의 파라미터로 json 같은 형태의 데이터를 넣고 http body 에 담아 url을 호출할 수 있다는 것이다

 

 

- R062_AxiosPost.js

import React, { Component } from 'react';
import axios from "axios";

class R062_AxiosPost extends Component {
    componentDidMount() {
        axios.post('http://date.jsontest.com/', {
            a: "react", b:200
         })
         .then( reponse => {alert(reponse.data.date)})
}

render() {
    return (
        <h1>Axios Post</h1>
    )
}
}
export default R062_AxiosPost;

 

 

- App.js

import React from 'react';
//import './App.css'; 
//App.css가 App.js 보다 더 한 단계 상위 폴더에 있다면  
//'./..App.css'

import AxiosPost from './R062_AxiosPost'
//import 'bootstrap/dist/css/bootstrap.css'

function App() {
  return (
    <div>
      <h1>Start React 200!</h1>
      <AxiosPost/>
    </div>
  );
}

export default App;

 

 

결과

'REACT' 카테고리의 다른 글

REACT_Promise Then  (0) 2024.09.24
REACT_Callback  (0) 2024.09.24
REACT_AxiosGet  (1) 2024.09.24
REACT_Fetch Post  (1) 2024.09.24
REACT_Fetch Get  (0) 2024.09.24