vue2.0下axios跨域
1.安装axios,并配置相应文件:
npm install axios --save
2.在 src/main.js 中如下声明使用:
import axios from 'axios';
Vue.prototype.$axios=axios;
3.在 config/index.js 中的 的dev 添加以下代码,设置一下proxyTable
'/api': {
target : 'http://guoxue365.cn', //设置你调用的接口域名和端口号.别忘了加http
changeOrigin : true, //允许跨域
pathRewrite : {
'^/api':
// '/'这里理解成用‘/api’代替target里面的地址,后面组件中我们掉接口时直接用api代替。比如我要调用'http://guoxue365.cn/api/video/list',直接写‘/api/video/list’即可
}
}
},
4.在.vue文件中使用
<
script
>
import axios from 'axios';
export default {
name: 'hello',
data () {
return {
msg: '调用api',
movieArr : []
}
},
methods:{
sayOut () {
this.$axios.get('/api/video
/list
)
.then((response) => {
console.log(response)
console.log(response.data.subjects)
this.movieArr = response.data.subjects
})
}
}
}
</
script
>