您现在的位置是:首页 > 前端开发 > vue全家桶

vue-cli 引用axios,跨越问题详细教程

admin2018-12-27vue全家桶 人已围观

简介在这个过程中,我也是遇到了跨越问题,看了文档,什么配置那个这个,然后绕了一圈搞完了,然后把步骤记录下来。希望能帮助到大家。

找到对应目录 cmd 下载 axios 
 
npm install axios    
淘宝镜像 cnpm install axios

1、找到vue-cli 文件夹里面的 src/main.js

2、进入main.js 文件夹先导入axios
 

import Axios from 'axios'

然后就是在Vue原型下面添加,axios不是插件,无法使用vue.use()
 


Vue.prototype.$axios =Axios

3、找到config/index.js 文件夹里面修改参数
proxyTable: {
  '/api':{
    target: 'https://api.douban.com',
    changeOrigin: true,
    pathRewrite: {
      '^/api': ''
    }
  }
},
 

5、在找到src/main.js 添加刚才引入的API
 

Vue.prototype.HOST="/api";  //引入API

 

6、在scr/components 里面的文件夹里面调用接口
//axiso 生命周期函数
created() {
  let url = this.HOST + "/v2/movie/top250";
  this.$axios.get(url, {
    start: 0,
    count: 10
  })
    .then(res => {
      console.log(res)
    })
    .catch(error => {
      console.log(error)
    })
},



然后就ok了 ,希望能帮助到大家,谢谢!

很赞哦!225

相关文章

文章评论

      匿名评论
    • 评论
    人参与,条评论

站点信息

  • 建站时间:2018-12-23
  • 网站程序:帝国CMS7.5
  • 文章统计: 183
  • 文章评论:490条
  • 统计数据百度统计
  • 微信公众号:扫描二维码,关注我们