Vue中使用jsonp进行跨域请求

Vue-resouse中可以通过this.$http.jsonp的方式直接使用jsonp进行跨域请求。官方在推荐使用axios之后,axios并没有集成jsonp。但在axios的github中(https://github.com/mzabriskie/axios/blob/master/COOKBOOK.md#jsonp),可以直接安装jsonp并使用他来坐跨域请求。

<script>

var jsonp = require('jsonp');
export default {
data() {
return {
author: "微信公众号 jinkey-love",
articles: []
}
},
mounted: function() {
let that = this
jsonp('https://api.douban.com/v2/movie/top250?count=20', null, function (err, data) {
if (err) {
console.error(err.message);
} else {
that.articles=data.subjects
}
});
}
}


</script>

在vue组件中,可以这样使用,我使用的是豆瓣的一个api接口,但是需要注意的是,jsonp中的函数作用域有变化,因此,需要 在请求之前,let that = this 保存当前的this

猜你喜欢

转载自blog.csdn.net/Kalama/article/details/82215608
今日推荐