03-Vue.js-axios和fetch、计算属性、混入、组件

一、axios和fetch

1、目的：在框架中使用数据请求

2、分类：

• 原生js提供的fetch
• 使用第三方封装库axios
• Vue中可以统一对axios进行挂载
  Vue.prototype.$http=axios

3、请求方式

• 请求静态数据（模拟假数据—mock数据）
• 请求动态数据 （通过后端接口请求数据）

4、axios和fetch的区别

• axios对已获得的数据进行了封装，防止XSRF攻击
• axios底层自动对数据进行了格式化

GET方法
        A: 无参数
        axios.get(url).then(res=>console.log(res).catch(error=>conosle.log(error))
        
        B: 有参数
        axios({
   
            url: 'http://xxx',
            method: 'get' //默认就是get,这个可以省略，
            params: {
   
                key: value
            }
        })

POST方法
        1. 先设置请求头 
        2. 实例化 URLSearchParams的构造器函数得到params对象
        3. 使用params对象身上的append方法进行数据的传参

        // 统一设置请求头
        axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded'; 
        let params = new URLSearchParams()