vue axios 2 的5种请求方法 及 axios 的两种写法

vim demon01.vue

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

<script>
  /*
    axios请求方法：get,post,put,patch,delete

    get:   获取数据
    post:  提交数据(表单提交，文件上传)
    put:   更新数据(所有数据推送到后端)
    patch: 更新数据(只将修改的数据推送到后端)
    delete:删除数据
  */
import axios from 'axios'
export default {
  name: 'demon01',
  components: {},
  created() {
    //定义变量时，该变量不被使用时也会报错
    let url = "http://127.0.0.1:8001/super_cmdb/serverhost_list/"
    let my_data = {
      "parameter1":"chenjianwen01",
      "parameter2":"chenjianwen02",
      "parameter3":"chenjianwen03"
    }
    axios.get(url).then(res=>{
      console.log(res);
      console.log("1111111111111");
    })
    axios({
      method: 'get',  //请求方法
      url: url,  //请求url
      params: { //get 请求带参数
        "id": 123456,
        "name": "陈建文"
      }
    }).then(res=>{
      let status = res.status;
      if (status==200){
        console.log(res);
        console.log("get请求成功，状态码200 ok")
      }else {
        console.log("get请求失败，状态码:",status)
      }
    })

    //post
    //form-data 表单提交(图片，文件上传)
    //applicition.json
    axios({
      method: 'post',
      url: url,
      data: my_data
    }).then(res=>{
      let status = res.status;
      if (status==200){
        console.log(res);
        console.log("post请求成功，状态码200 ok")
      }else {
        console.log("post请求失败，状态码:",status)
      }
    })
    //form-data请求
    let formData = new FormData()
    for(let key in my_data){
      formData.append(key,my_data[key])
    }
    axios.post(url,formData).then(res=>{
      console.log(res)
    })
    //put请求
    axios.put('/put',my_data).then(res=>{
      console.log(res)
    })
    //patch请求
    axios.patch('/patch',my_data).then(res=>{
      console.log(res)
    })
    //delete请求
    axios.delete('/delete',{
      params:{  //params 链接带参数
        id:12
      }
    }).then(res=>{
      console.log(res)
    })
    axios.delete('/delete2',{
      data:{  //data 链接不带参数
        id:12
      }
    }).then(res=>{
      console.log(res)
    })
    axios({
      method: 'delete',
      url: '/delete3',
      params: {id:12}
      //data: {id:12}
    }).then(res=>{
      console.log(res)
    })
  }
}
</script>