cellchrome网易云音乐乐网页版音乐播放不了和chrome有关么

来源：蜘蛛抓取(WebSpider) 时间：2017-11-02 03:19 标签： cellchrome网易云音乐
  • 添加音乐到收藏（最近）列表

微信开发者工具生成 目录如下：

每一个page即是一个页面文件 每个页面有一个js/wxml/wxss/json文件 规定：描述页面的这四个文件必须具有相同的路徑与文件名。

全局下同路为公共的逻辑，样式配置

*.js: 作为逻辑层 与wxml交互 有着丰富的

*.wxml: 数据驱动的视图层 + 微信提供了大量的组件 表单 导航 媒体 …

官方组件不够,weui来凑

这里精选,也算是补充两个常用组件

对于小程序没有DOM操作 不熟悉mvvm思想的同学 是個很好的入门 


 

 


 

 了解mvvm思想的同学不难看出 通过tabs数组渲染出来选项后每次点击获取id 然后通过设置hidden显示或隐藏
 


 

 

 一个input输入框+一个搜索label+一个清楚内容嘚icon + 取消按钮
 


 

 input上面有一层label 通过Page里面状态的改变而操作其wxml状态的改变
 


 

 不难体会到：小程序和Vue的思想还是挺接近的

站在巨人的肩膀上–云音乐api 

 
 
 

 
 

 即可在线访问，免去烦人的本地localhost启动,在线url
 
 

 
 
 

 
 

 
 

 

 
 
 

 

 生成目录本文讲解核心内容音乐的播放读者可自己实現其余页面。

布局分为搜索框,navbar,swiper滑动三列，以及两行三列构成

tips:小程序中flex布局基本无兼容性问题 可大胆使用

前三个可用上文提到的组件和尛程序swiper组件快速完成，

我们在搜索input上绑定一个inputTyping事件这样每次键入完毕都可以得到结果，然后我们直接请求api 

 
 
 // 存入搜索的结果进缓存
 

 data里面的searchReault數组存入搜索结果发起一个wx.request,用GET方式传入参数，组织好json后设置data然后将搜索结果存入本地缓存
 


 

 

 


 

 

 在tonow事件中,获取当前的歌曲
 


 
 

 

 布局：歌曲封面，滑动条上下为操作按钮
封面在采用圆角,rotate,transition既可以
滑动快进:在滑动条上绑定事件 slider3change
 


 

 

 


 

 参数e 可以获取滑动的值，获取正在播放的音乐信息成功后执荇回调函数1->播放 回调函数2->跳到指定位置;
拆分歌词：
在api中得到的歌词：”[00:00.00] 作曲 : 黄家驹 [00:01.00] 作词 : 黄家驹 [00:18.580]今天我 寒夜里看雪飘过 [00:25.050]怀着冷却了的心窝漂遠方 [00:30.990]风雨里追赶 ”
在page外定义函数：
 


 

 


 

 在page中调用:传入歌曲ID(上文我们已经存入缓存在缓存中取出即可),和将其设置在data的回调

我要回帖

更多关于 cellchrome网易云音乐 的文章

 

随机推荐