Promise就是一个给一步操作提供的容器,在这个容器里,有两个阶段无法改变的阶段,第一个阶段就是Pending(进行),第二个阶段就是结果阶段,包含Fulfilled(成功)、Rejected(失败)两个结果。
这两个结果不会改变。然后结果结束后就会用then来执行相应的结果。
new Promise((resolve,reject)=>{ 相应操作 if(异步操作成功){ resolve(value) }else{ reject(error) } }).then(value=>{ // 成功后操作 },error=>{ // 失败后操作 })
用Promise封装jsonp方法
import originJSONP from 'jsonp' // 这时候Url是不带参数的,我们让data变成参数,data在具体定义获取具体内容的时候再单独配置 export default function jsonp(url, data, option) { // 看url是否有问号的意思就是只在第一次加参数的时候加一个问号,剩下就是加& url += (url.indexOf('"htmlcode">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: 'h5', uin: 0, needNewCode: 1 }) // 最后返回的是 return jsonp(url, data, options) }再相应组件中进行调用
<script> import { getRecommend } from 'api/recommend' import { ERR_OK } from 'api/config' export default { created() { this._getRecommend() }, methods: { _getRecommend() { getRecommend().then(res => { if (res.code === ERR_OK) { console.log(res.data.slider) } }) } } } </script>然后就可以在控制台获得数据了
总结
以上所述是小编给大家介绍的vue中利用Promise封装jsonp并调取数据,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!
风云阁资源网 Design By www.bgabc.com
广告合作:本站广告合作请联系QQ:858582 申请时备注:广告合作(否则不回)
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
免责声明:本站资源来自互联网收集,仅供用于学习和交流,请遵循相关法律法规,本站一切资源不代表本站立场,如有侵权、后门、不妥请联系本站删除!
风云阁资源网 Design By www.bgabc.com
暂无评论...
更新日志
2024年09月23日
2024年09月23日
- 何耀珊.2006-收获【华纳】【WAV+CUE】
- 梁汉文1994-壹精选[华星][WAV+CUE]
- 洪荣宏1981-歹路不可行·相思雨(飞跃复刻版)[光美][WAV+CUE]
- 旅行团2015-10Day’s[来福胶泥][WAV+CUE]
- 龙千玉.2011-卡将哟【豪记】【WAV+CUE】
- 蔣志光.1993-多情多寂寞(国专)【BMG】【WAV+CUE】
- 陈慧娴.1996-雪映美白96演唱会2CD(2024环球红馆40复刻系列)【环球】【WAV+CUE】
- 王子异《1996 Part.2》[FLAC/分轨][50.66MB]
- 贵族音乐《古典名曲与轻音乐钢琴 打开宝宝睡眠开关》[320K/MP3][155.91MB]
- 贵族音乐《古典名曲与轻音乐钢琴 打开宝宝睡眠开关》[FLAC/分轨][251.78MB]
- 黄韵玲2001-巴结音乐[全员集合][WAV+CUE]
- 郑绪岚2015-流金岁月·精选[首版][WAV+CUE]
- 周冰倩1995《沧桑情歌》JVC日本录制[WAV+CUE]
- 辛禄乐队.2024-热烈的少年【星辰】【FLAC分轨】
- 成龙.1996-龙的心【滚石】【WAV+CUE】