axios

axios是什么

axios是基于promise机制实现的异步链式请求框架,体积小。

底层原理:promise+ajax

基本api

axios.get()get请求 获取数据

axios.post()post请求 提交数据

axios.put()put请求 更新数据

axios.delete() 删除数据

用法

对象使用:axios.get('url',params).then(response=>{

console.log(response)

})

函数使用:axios({

url:"url",

method:"method",

headers: {'X-Requested-With': 'XMLHttpRequest'},

}).then((res)=>{console.log(res)}).catch((err)=>{console.log(err)})

axios.defaults.baseURL = 'https://api.example.com';(设置基础路径)

拦截器

axios.interceptors.request.use()请求拦截器

axios.interceptors.response.use()响应拦截器

用法:

axios.interceptors.request.use((config)=>{

return config

},(error)=>{

return promise.reject(error)

})//两种拦截器用法一样。

axios创建实例

const instance = axios.create({

    baseURL:'https://some-domain.com/api/',

    timeout:1000,

    headers:{'X-Custom-Header':'foobar'}

)

用处:比如你需要访问多个服务地址,而这些服务请求和响应的结构都完全不同,那么你可以通过axios.create创建不同的实例来处理。

instance.get()

取消请求

axios.CancelToken()


let cancel

axios.get('url',{

cancelToken:new axios.CancelToken((c)=>{

    cancel = c//是取消当前请求的函数;保存起来,用于之后取消当前请求。

})

}).then(

    (res)=>{console.log(res)}

)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 我们在实际的Vue项目中经常需要与后端进行数据交互,但是在很大程度上我们需要用到这个插件,但是这里需要注意的一点是...
    Marin_chen阅读 13,744评论 0 5
  • 一、安装 1、 利用npm安装npm install axios --save 2、 利用bower安装bower...
    kiddings阅读 5,796评论 0 3
  • 1、axios安装 1.1、 利用npm安装npm install axios --save1.2、 利用bowe...
    令武阅读 11,574评论 1 4
  • GET 请求 // Make a request for a user with a given IDaxios....
    2b61575c37fd阅读 2,854评论 0 0
  • 崇武的“午后”,“午后”的崇武休憩小店。城墙边的晃悠的夜生活,昏暗的黄灯,飘垂的榕须,六百年的石头,延绵跌宕的垛口...
    惠安啊乐阅读 1,130评论 0 0

友情链接更多精彩内容