<template>
  <div class="home">
    
  </div>
</template>

<script>
// @ is an alias to /src
/*
  get,post,put,patch,delete

  get：获取数据
  post：新建，提交数据（表单提交，文件上传）
  put：更新数据（所有数据推送到后端）
  patch：更新数据（只将修改的数据推送到后端）
  delete：删除数据
*/
import axios from ‘axios‘;

export default {
  name: ‘axios2-2‘,components: {
    
  },created() {
    //get请求
    //http://127.0.0.1:8081/data.json?id=12
    axios.get(‘/data.json‘,{
      params: {
        id: 12,}
    }).then((res)=>{
      console.log(res)
    })

    axios({
      method: ‘get‘,url: ‘/data.json‘,params: {
        id: 12,},}).then(res=>{
      console.log(res)
    })


    //post请求
    /*
      data
      form-data：表单提交（图片上传，文件上传）
      application/json：
    */
    let data = {
      id: 12,};

    axios.post(‘/post‘,data).then(res => {
      console.log(res);
    });

    axios({
      method: ‘post‘,url: ‘/post‘,data: data,}).then(res => {
      console.log(res);
    });

    //post：form-data 请求
    let formData = new FormData();
    for(let key in data){
      formData.append(key,data[key])
    }
    axios.post(‘/post‘,formData).then(res=>{
      console.log(res);
    });


    //put请求
    axios.put(‘/put‘,data).then(res => {
      console.log(res);
    })

    //patch请求
    axios.patch(‘/patch‘,data).then(res => {
      console.log(res);
    })

    //delete请求
    // axios.delete(url,config)

    //url传递参数(http://127.0.0.1:8080/delete?id=12)[Query String Parameters]
    axios.delete(‘/delete‘,{
      params:{
        id: 12,}
    }).then(res=>{
      console.log(res)
    })

    //不是url传递参数(http://127.0.0.1:8080/delete)[Request Payload]
    axios.delete(‘/delete‘,{
      data:{
        id: 12,}
    }).then(res=>{
      console.log(res)
    })


    axios({
      method: ‘delete‘,url: ‘/delete‘,// params: {
      //   id: 13,
      // }
      data: {
        id: 13,}
    }).then(res=>{
      console.log(res)
    })

  },}
</script>