码迷,mamicode.com
首页 > 移动开发 > 详细

vue前端之axios

时间:2021-01-13 11:13:47      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:def   请求方式   error   key   response   tor   前端   全局变量   没有   

  上大学后,就一直想着写这技术博客,用来记载学过的技术。可是一直没有行动。这次上班了,由于前端技术的短板,任务总是事倍功半。这次下定决心,认真的将日后工作中,学习中遇到的技术问题记载下载。方便日后回顾。

  回归正题,公司用到的框架的是vue,这几周恶补了一下前端,今天正好学到了axios,就从这里开始记录吧。

        1、Vue中使用axios首先安装axios 1)npm install; 2) npm install vue-axios --save; 3)npm install qs.js --save ; 

安装成功后,在main.js页面中进行引入,

  import Vue from ‘vue‘

  import axios from ‘axios‘

  Vue.protorype.$axios = axios   //全局注册,使用this.$axios 可以在任意组件中调用

  Vue.prototype.$qs = qs          //全局注册  ‘$‘是前端开发默认的习惯,目的是区分全局变量与本地变量

  2、使用请求  

<script>
    export default{
        data(){
            return {
                username:ren,
                password:haha
            }
        },
        created(){
            this.$axios({
                method:‘post‘, //请求方式
                url:‘www.baidu.com‘,  //请求地址
                data:this.qs.stringify({     //请求参数 qs是将参数转化为后台需要的参数类型
                    username = this.username,
                    password = this.password,
                }).then(response => {
                    console.log(response),
                }).catch(error => {
                    console.log(error)
                }
            }),

            //简写
            this.$axios.get("www.baidu.com",{
                params:{
                    username:ren,
                    password:haah
                }
               }
            ).then(res => {console.log(res.data)})
        }
    }
</script>  
  
  

 

  

 

  

vue前端之axios

标签:def   请求方式   error   key   response   tor   前端   全局变量   没有   

原文地址:https://www.cnblogs.com/youqianren/p/14264910.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!