axios——接口连接,数据请求

 
1,安装axios
 
在项目下执行npm install axios
之后在main.js文件中,添加:
1 import axios from 'axios'
2 Vue.prototype.&axios=axios  ——————————————axios不能用Vue.use(axios),只能用原型链prototype!!!
2,axios-get请求方式
 
不带参数时:
 1 let url="..."
 2 this.$axios.get(url)  ————————————访问接口地址
 3 
 4 .then(res=>{          ————————————访问成功之后
 5     console.log(res)
 6 })
 7 
 8 .catch(err=>{         ————————————访问出错之后
 9     console.log(err)
10 })

带参数时:

 1 let url="..."
 2 this.$axios.get(url,{
 3     params:{          ——————————————参数放在params属性下
 4         参数名:参数值
 5     }
 6 }) 
 7 
 8 .then(res=>{         
 9     console.log(res)
10 })
11 
12 .catch(err=>{        
13     console.log(err)
14 })

 

3,axios-post请求方式
 
带参数时:
 1 let url="..."
 2 let data={
 3     name:value
 4 }
 5 this.$axois.post(url,data )
 6 
 7 .then(res=>{
 8     console.log(res)
 9 })
10 
11 .catch(err=>{
12     console.log(err)
13 })

axios-post的jQ经典写法

1 this.$axios({
2     url:接口地址,
3     method:"post",
4     data:{},     //向后台传参数
5     headers:{}
6 }).then(res=>{
7     处理返回的数据代码
8 })

 

 

posted @ 2021-02-26 15:57  是天天呀!  阅读(216)  评论(0)    收藏  举报