vue2.0 axios跨域并渲染的問(wèn)題解決方法

import axios from
'axios';
Vue.prototype.$axios=axios;

dev:
 { 
加入以下
proxyTable:
{
'/api':
{
target:
'http://api.douban.com',//設(shè)置你調(diào)用的接口域名和端口號(hào)
 別忘了加http 
changeOrigin:
true,
pathRewrite:
 { 
'^/api':
'/'//這里理解成用‘/api'代替target里面的地址，后面組件中我們掉接口時(shí)直接用api代替
 
比如我要調(diào)用'http://api.douban.com/v2/movie/top250'，直接寫‘/api/v2/movie/top250'即可
}
}
},

module.exports = merge(prodEnv, {
 NODE_ENV: '"development"',//開發(fā)環(huán)境
 API_HOST:"/api/"
})

module.exports = {
 NODE_ENV: '"production"',//生產(chǎn)環(huán)境
 API_HOST:'"http://api.douban.com"'
}

instance.post(process.env.API_HOST+'user/login', this.form)

<template>
<div>
  <ul>
    <li v-for="item in movieArr">
      <span>{{item.title}}</span>
    </li>
  </ul>
  <button @click="sayOut">渲染</button>
</div>
</template>
<script>
export default {
 data () {
  return {
    movieArr : []
  }
 },
 methods: {
   sayOut () {
     this.$axios.get('/api/v2/movie/top250')
    .then((response) => {
       console.log(response.data.subjects)
       this.movieArr = response.data.subjects // 這里要強(qiáng)調(diào)一下這個(gè)this 箭頭函數(shù)指的是它的父級(jí)也就是vue實(shí)例 然后不用箭頭函數(shù)的話 this是一個(gè)undefined 無(wú)法.movieArr來(lái)給他賦值 這里要注意一下 我被坑了半天 希望小伙伴不要被坑
    })
   }
 }
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>