美文网首页
vue-cli 引入axios

vue-cli 引入axios

作者: qishuangyan | 来源:发表于2018-05-09 19:13 被阅读0次

使用 cnpm 安装 axios

cnpm install axios --save-dev

首先在 main.js 中引入 axios

import axios from 'axios'

这时候如果在其它的组件中,是无法使用 axios 命令的。所以我们将 axios 改写为 Vue 的原型属性

Vue.prototype.$http = axios

在 main.js 中添加了这两行代码之后,就能直接在组件的 methods 中使用 $http命令

例如

methods: {

      show()  { 

            this.$http ({

                method:'get', 

                url:'/user', 

                 data: {

                      name:'virus'

                  }

             })

 }

配置 axios

 1.对于get请求

     axios.get('/user', {  

        params:{     

           name:"virus"

          }    

})

2.对于post请求

axios.post('/user',{ 

     name:"virus"

})

3、 一次性并发多个请求

function getUserAccount (){

  return axios.get ('/user/12345');

}

functiongetUserPermissions(){

  return axios.get('/user/12345/permissions');

}

axios.all([getUserAccount(),getUserPermissions()])  

  .then(axios.spread(function(acct,perms){

//当这两个请求都完成的时候会触发这个函数,两个参数分别代表返回的结果

}))

4.axios可以通过配置(config)来发送请求

//发送一个`POST`请求

axios({    

     method:"POST",  

     url:'/user/1111',   

     data:{      

         name:"virus"

     }

});

相关文章

网友评论

      本文标题:vue-cli 引入axios

      本文链接:https://www.haomeiwen.com/subject/wpuorftx.html