Vue從瞭解到清晰-Vue2.0中使用vue-jsonp解決跨域問題（看看這篇就夠了）

 

一、執行命令：

npm install vue-jsonp --save

　　 

二、src/main.js中添加：

import VueJsonp from 'vue-jsonp'
Vue.use(VueJsonp)

 

三、其它組件中基本使用方法：

this.$jsonp(rootApi+'/company/Info'', 傳參參數對象{} ).then(json => {
　　// 返回數據 json， 返回的數據就是json格式
}).catch(err => {
　　console.log(err)
})

 

四、其餘實例：

 

4.1：

this.$jsonp(ApiRoot+'/company/Info', 
{
　　callbackQuery: 'callbackParam', // jsonp key //請求傳遞參數 1
　　callbackName: 'jsonpCallback', // jsonp key //請求傳遞參數 2
　　name: 'zhangsan', //請求傳遞參數 3
　　type: 6 //請求傳遞參數 4
} 
).then(json => {
　　// 返回數據 json， 返回的數據就是json格式
}).catch(err => {
　　console.log(err)
})

 

4.2：

this.$jsonp(ApiRoot+'/company/Info', 
　　Object.assign(this.$store.state.common, {callbackQuery: 'callbackParam', callbackName: 'jsonpCallback'})
).then(json => {
　　_this.pageData = json.result
}).catch(err => {
　　console.log(err)
}) 

 

----

說明：Object.assign() 爲 es6 javascript對象方法，功能是合併多個對象數據

 

 

本文地址：https://www.cnblogs.com/rapale/p/7839203.html