在npm上下载jsonp的包

这个包的用法 传入的参数是地址加上地址参数的混合  但是想封装一个将地址和地址参数分别传入的jsonp方法

所以来封装一个

import originJSONP from 'jsonp'

export default function jsonp(url,data,options){
url+=(url.indexOf('?')<0?'?':'&')+param(data)
return new Promise((resolve,reject)=>{
originJSONP(url,options,(err,data)=>{
if(!err){
resolve(data)
}else{
reject(err)
} }) })
} 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):'' }

用Vue来实现音乐播放器(六):JSONP的封装的更多相关文章

  1. vue小练习--音乐播放器

    1 首先建一个文件夹 放几首歌曲 2 看代码 1)基本版本 <!DOCTYPE html> <html lang="zh-CN"> <head> ...

  2. 用Vue来实现音乐播放器(三十八):歌词滚动列表的问题

    1.频繁切换歌曲时,歌词会跳来跳去 原因: // 歌词跳跃是因为内部有一个currentLyric对像内部有一些功能来完成歌词的跳跃 //每个currentLyric能实现歌曲的播放跳到相应的位置 是 ...

  3. Vue实战:音乐播放器(一) 页面效果

    先看一下效果图 首页 歌单详情页 歌手列表 歌手详情页 排行页面 榜单的详情页(排序样式) 搜索页面 搜索结果 播放器内核 歌词自动滚动 播放列表 用户中心

  4. 用Vue来实现音乐播放器(十六):滚动列表的实现

    滚动列表是一个基础组件  他是基于scroll组件实现的 在base文件夹下面创建一个list-view文件夹 里面有list-view.vue组件     <template> < ...

  5. 用Vue来实现音乐播放器(九):歌单数据接口分析

    z这里如果我们和之前获取轮播图的数据一样来获取表单的数据  发现根本获取不到 原因是qq音乐在请求头里面加了authority和refer等 但是如果我们通过jsonp实现跨域来请求数据的话  是根本 ...

  6. 用Vue来实现音乐播放器(八):自动轮播图啊

    slider.vue组件的模板部分 <template> <div class="slider" ref="slider"> <d ...

  7. 用Vue来实现音乐播放器(二十三):音乐列表

    当我们将音乐列表往上滑的时候   我们上面的歌手图片部分也会变小 当我们将音乐列表向下拉的时候   我们的图片会放大 当我们将音乐列表向上滑的时候   我们的图片有一个高斯模糊的效果 并且随着我们的列 ...

  8. 用Vue来实现音乐播放器(二十一):歌手详情数据抓取

    第一步:在api文件夹下的singer.js中抛出getSingerDetail方法 第二步:在singer-detail.vue组件中引入api文件夹下的singer.js和config.js 第三 ...

  9. 用Vue来实现音乐播放器(二十):Vuex初始化及歌手数据的配置

    state:所有组件的所有状态和数据  放入同一个内存空间去管理 我们把它称为state Vue Components:state里面的数据可以方便的映射到组件上 然后渲染组件 Actions:当组件 ...

随机推荐

  1. 工作笔记20170315-------关于FAQ(Frequently Asked Questions)列表的代码

    源自于:http://www.17sucai.com/pins/3288.html (1)FAQ问答列表点击展开收缩文字列表 <ul>   <li class="clear ...

  2. nginx配置反向代理,解决前端开发的跨域问题

    适用:开发和生产环境 配置如下 server { listen 10901; server_name res.pre.ices.red; #charset koi8-r; #access_log lo ...

  3. js常见的设计模式一

    1.观察者模式 定义一些一对多的关系,将一系列的观察者对目标函数感兴趣,将自己添加进目标函数,当目标函数状态发生改变时,发送通知,以此通知附加在目标上的观察者 /* 目标 */ class subje ...

  4. JavaScript生成简单数字验证码

    <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8& ...

  5. IDEA创建maven的web项目时,main文件夹下没有java,resources目录等源文件夹

    https://blog.csdn.net/qq_34377273/article/details/83183307

  6. 从零开始学MySQL(四)

    上节连接:https://www.cnblogs.com/RajXie/p/10880809.html 上节说到,在创建表的同时,需要给出列的定义.列的定义可展开如下: 列名 列的数据类型 列的一些其 ...

  7. Centos6.6安装MySQL5.6.24

    1.首先需要编译器gcc 编译器和cmake yum -y install gcc+ gcc-c++ cd /usr/local/src wget http://www.cmake.org/files ...

  8. 多线程 - 内存屏障和cpu缓存

    CPU性能优化 - 缓存 为了提高程序运行的性能,现代CPU在很多方面会对程序进行优化.CPU的处理速度是很快的,内存的速度次之,硬盘速度最慢.在cpu处理内存数据中,内存运行速度太慢,就会拖累cpu ...

  9. [转]tKC(The Keyboard Caper)的自传

    每个玩儿计算机的朋友都知道破解,或多或少地使用着各种各样的破解,也就逐渐地知道了一些著名的破解团体和破解人,比如:PC(Phrozen Crew).CiA(Crackers in Action)COR ...

  10. MyEclipse XML & XML架构教程:XML Schema (XSD)编辑器

    [MyEclipse CI 2019.4.0安装包下载] 1. MyEclipse中的XSD编辑 本文档介绍MyEclipse XML Schema(XSD)编辑器中的一些可用函数.XML Schem ...