框架级的数据请求 watch 计算属性 mixins 原理

本文探讨了Vue框架中的数据请求,包括axios和fetch的使用,对比了vue-resource的特点。axios作为常用的请求库,提供了Promise支持和额外的安全性封装。fetch虽然原生支持,但需要手动处理数据格式。此外,文章还介绍了Vue中的watch特性,用于监听data中的数据变化并触发相应操作。
摘要由CSDN通过智能技术生成

框架级的数据请求

  1. axios ( 第三方库 — 别人封装好的库 )

  2. fetch ( javascript 原生提供 )

  3. vue这边的数据请求的发展

  • vue-resource ( Vue 以前自己封装使用的请求类库 ) ,但是 vue-resource作者已经放弃更新了
  • vue-resource 作者推荐我们使用 axios
  • vue-resource 用法 和 axios 相似度 90% +
  • vue2.0我们基本上使用的都是 fetch / axios
  • vue-resource 是有jsonp的
  • vue-resource 如果在vue中使用,是挂载当前的 实例( 组件 ) 的$http属性身上的
    • 举例 this. h t t p ( o p t i o n s ) t h i s . http( options ) this. http(options)this.http.get() this.$http.post
  1. axios 和 fetch 没有jsonp 数据请求类型的
  • axios 和 fetch 都是promise

  • axios会对我们请求来的结果进行再一次的封装( 让安全性提高 )

  • 案例:

  new Vue({
   
    el: '#app',
    methods: {
   
      getData () {
   
        //进行get请求
        // axios.get()    -- $.get()
        // axios.post()    ---$.post()
        // axios(options)      -- $.ajax(options)

        // var p = axios({
   
        //   url: './data/data.json'
        // })

        // console.log( p )  Promise对象

        axios({
   
          url: './data/data.json',
          method: 'get',//默认就是get请求
        }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值