zoukankan      html  css  js  c++  java
  • vue3中使用axios

    axios是一个库,并不是vue中的第三方插件,使用时不能通过Vue.use()安装插件,需要在原型上进行绑定,

    例如以下写法是vue2引入axios的写法

    import Vue from 'vue'
     
    import axios from ‘axios’
     
    Vue.prototype.$http = axios

    然而,在vue3.0,并不是直接创建的vue实例,而是通过createApp来创建的

    那么问题就来了,这样的话,

    一,vue3.0要通过app.config.globalProperties.$axios = axios进行挂载

    二,vue-axios

    vue-axios是将axios集成到Vue.js的小包装器,可以像插件一样进行安装

    在mian.js中引用axios,vue-axios,通过全局方法 Vue.use() 使用插件,就相当于调用install方法

    import axios from 'axios'
     
    import VueAxios from 'vue-axios'
     
    createApp(App).use(VueAxios, axios)
    

      

    即可,后续使用,还是照常用

    vue.axios.get(api).then((response) => {
    console.log(response.data)
    })
    this.axios.get(api).then((response) => {
    console.log (response.data)
    })
    this.$http.get(api).then((response) =>{
    console.log( response.data)
    })
    

    使用 Vue 的插件写法,更符合 Vue 整体生态环境。直接写原型链,感觉有些粗暴了,搞定

  • 相关阅读:
    leecode-数组-27Remove Element-java
    win7未在本地计算机注册microsoft.jet.oledb.4.0+inetmgr
    VS2013+opencv2.4.9+MFC
    adb远程调试
    Service,测试
    symfony-表单学习
    Doctirne---查询更新等操作
    Doctrine2-完整创建数据库
    Doctrine2-基础概念
    twig模板基本学习
  • 原文地址:https://www.cnblogs.com/sinceForever/p/14561570.html
Copyright © 2011-2022 走看看