Promise就是一個給一步操作提供的容器，在這個容器里，有兩個階段無法改變的階段，第一個階段就是Pending(進行)，第二個階段就是結(jié)果階段，包含F(xiàn)ulfilled(成功)、Rejected(失敗)兩個結(jié)果。
創(chuàng)新互聯(lián)建站成立于2013年，我們提供高端重慶網(wǎng)站建設(shè)公司、成都網(wǎng)站制作公司、成都網(wǎng)站設(shè)計、網(wǎng)站定制、全網(wǎng)營銷推廣、微信平臺小程序開發(fā)、微信公眾號開發(fā)、seo優(yōu)化服務(wù)，提供專業(yè)營銷思路、內(nèi)容策劃、視覺設(shè)計、程序開發(fā)來完成項目落地，為汽車玻璃修復(fù)企業(yè)提供源源不斷的流量和訂單咨詢。
這兩個結(jié)果不會改變。然后結(jié)果結(jié)束后就會用then來執(zhí)行相應(yīng)的結(jié)果。
重慶分公司
重慶分公司
new Promise((resolve,reject)=>{
相應(yīng)操作
if(異步操作成功){
resolve(value)
}else{
reject(error)
}
}).then(value=>{
// 成功后操作
}，error=>{
// 失敗后操作
})用Promise封裝jsonp方法
import originJSONP from 'jsonp'
// 這時候Url是不帶參數(shù)的，我們讓data變成參數(shù)，data在具體定義獲取具體內(nèi)容的時候再單獨配置
export default function jsonp(url, data, option) {
// 看url是否有問號的意思就是只在第一次加參數(shù)的時候加一個問號，剩下就是加&
url += (url.indexOf('?') < 0 ? '?' : '&') + param(data)
return new Promise((resolve, reject) => {
originJSONP(url, option, (err, data) => {
if (!err) {
resolve(data)
} else {
reject(err)
}
})
})
}
// 將data數(shù)據(jù)遍歷，前提data是一個數(shù)組
function param(data) {
let url = ''
for (var k in data) {
let value = data[k] !== undefined ? data[k] : ''
url += `&${k} = ${encodeURIComponent(value)}`
}
//刪除第一個&符號
return url ? url.substring(1) : ''
}定義一個重復(fù)比較多的配置文件config.js
export const commonParams = {
g_tk: 5381,
inCharset: 'utf-8',
outCharset: 'utf-8',
notice: 0,
format: 'jsonp'
}
// jsonp默認的options就是jsonpCallback
export const options = {
param: 'jsonpCallback'
}
export const ERR_OK = 0然后再進行獲取頁面方法的封裝
import jsonp from 'common/js/jsonp'
import { commonParams, options } from './config'
export function getRecommend() {
// 獲取qq音樂的地址
const url =
'https://c.y.qq.com/musichall/fcgi-bin/fcg_yqqhomepagerecommend.fcg'
// object.assign()方法來合并commonParams對象和后面的對象
const data = Object.assign({}, commonParams, {
platform: 'h6',
uin: 0,
needNewCode: 1
})
// 最后返回的是
return jsonp(url, data, options)
}再相應(yīng)組件中進行調(diào)用
然后就可以在控制臺獲得數(shù)據(jù)了
總結(jié)
以上所述是小編給大家介紹的vue中利用Promise封裝jsonp并調(diào)取數(shù)據(jù),希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對創(chuàng)新互聯(lián)網(wǎng)站的支持！
如果你覺得本文對你有幫助，歡迎轉(zhuǎn)載，煩請注明出處，謝謝！
