vue-axios跨域使用1.0

使用 npm:

$ npm install axios

使用webstrom创建一个vue项目 截图如下
图片.png

1打开跨域请求代理

config/index.js
module.exports{
dev: {
}
}
本人如下

dev: {

    // Paths
    assetsSubDirectory: 'static',
    assetsPublicPath: '/',
    proxyTable: {
      '/doubai_api':{
        target: 'http://api.douban.com',
        pathRewrite: {
          '^/doubai_api': ''
        },
        changeOrigin: true
      }


    },
      }

2在main.js中导入如下配置

import Axios from 'axios'
Vue.prototype.$axios = Axios
Vue.config.productionTip = false
Vue.prototype.HOST = '/doubai_api'

3在HelloWrold.vue组件中使用

export default {
  name: 'HelloWorld',
  data () {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  },
  mounted () {
    var url = this.HOST + '/v2/movie/in_theaters'
    this.$axios({
      method: 'get',
      url: url
    })
      .then(res => {
        console.log(res.data)
      })
      .catch(error => {
        console.log(error)
      })
  }
}

启动项目


图片.png

你可能感兴趣的:(vue-axios跨域使用1.0)