Vue中使用jsonp進行跨域請求

標籤：   函數   跨域   data   key   整合   ios   book   儲存   

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

Vue中使用jsonp進行跨域請求