axios

axios

本质是对ajax的封装在平时我们用的是ajax来发送请求，但在vue框架中我们推荐使用axios
简单的来说 ajax技术实现了网页的局部数据刷新，axios实现了对ajax的封装。

说明确点 axios是ajax ajax不止axios。

我们安装axios用npm install axios安装好axios后用** import axios from “axios” **来引入axios以便能在组件中使用或者使用CDN的方式引入

<script>
export default {
      data(){
          return{
              info:[]
          }
      },
      methods:{
 
      },
      mounted(){
           //get或者post , api为接口地址
           this.$axios.get('api',{
                 params:{  //post不需要params:这部分
                       //请求参数
                 }
           }).then(res => {  //res是返回结果
               //你的下一步操作 例:
                this.info = res.data  //存数据
           }).catch(err => { //请求失败就会捕获报错信息
                 //err.response可拿到服务器返回的报错数据       
           })
      } 
}
</script>

或者

<script>
export default {
      data(){
          return{
              info:[]
          }
      },
      methods:{
 
      },
      mounted(){
           //get或者post , api为接口地址
           this.$axios({
               method:'post',
               url:'api',
               data:{  //get这里应为params
                  //请求参数
               },
               //withCredentials:true, //局部携带cookie
               headers:{} //如果需要添加请求头可在这写
           }).then(res => {  //res是返回结果
               //你的下一步操作 例:
                this.info = res.data  //存数据
           }).catch(err => { //请求失败就会捕获报错信息
                 //err.response可拿到服务器返回的报错数据       
           })
      } 
}
</script>

ajax与axios的区别

ajax:

Ajax用原生代码就可以实现
Ajax = 异步 JavaScript 和 XML（标准通用标记语言的子集）。
Ajax 是一种用于创建快速动态网页的技术。
Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。
但是无限制的ajax的回调会崩溃的
通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。
传统的网页（不使用 Ajax）如果需要更新内容，必须重载整个网页页面。

axios：

从浏览器制作XMLHttpRequests
让HTTP从node.js的请求
拦截请求和响应（拦截器 还没学 有空会看看）
转换请求和响应数据等