找回密码
 立即注册

QQ登录

只需一步,快速开始

[Demo源码] 全栈开发音乐播放器微信小程序

[复制链接]
查看: 174|回复: 0
最佳答案
0 

4

主题

4

帖子

110

积分

新人求带

积分
110
 楼主| 发表于 6 天前 | 显示全部楼层 |阅读模式
代码规范
参考Airbnb/javascript

代码不写分号
采用let/const定义变量
采用箭头函数控制this指向
函数定义采用简写方式,如下示例
  1. functionName(){
  2.   // ...
  3. }
复制代码

所有简写的对象属性放在非简写的对象属性上面
即使最后一个属性或方法也加逗号,
如下示例
  1. const name = 'lpj'
  2. {
  3.   name,
  4.   age: 20,
  5. }
复制代码

组件化开发
组件的设计原则

  • 高内聚
  • 低耦合
  • 单一职责
  • 避免过多参数
  • 本项目自定义的组件
  • 歌单组件
  • 歌曲组件
  • 歌曲进度条组件
  • 歌词组件
  • 博客卡片组件
  • 博客控制组件(评论、分享)
  • 登录组件
  • 底部弹窗组件
  • 搜索组件

项目知识点以及BUG处理
tips: 小程序的背景图片不允许使用网络图片,但是允许使用本地图片和base64格式的图片

BUG && Handler
  1. // 数据监听器
  2. observers: {
  3.   ['playlist.playCount'](playCount) {
  4.     this.setData({
  5.       // 以下写法会造成该处理函数的自调用式死循环
  6.       ['playlist.playCount']: this._tranNumber(playCount, 2)
  7.     })
  8.   }
  9. },
复制代码
  1. data: {
  2.   _count: 0,// 页面中直接使用该值
  3. },
  4. observers: {
  5.   ['playlist.playCount'](playCount) {
  6.     this.setData({
  7.       _count: this._tranNumber(playCount, 2)
  8.     })
  9.   }
  10. },
复制代码
自定义wx:for的默认index和item
  1. <block wx:for="{{arr}}" wx:for-index="idx" wx:for-item="data">{{idx}}:{{data}}</block>
复制代码

详解wx:key的作用代码参见pages/demo/demo
游客,如果您要查看本帖隐藏内容请回复
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则



www.henkuai.com—微信开发者的分享交流平台,专注微信开发生态。

天津市滨海新区
中新生态城中成大道生态建设公寓9号楼3层301

微信公众号

广告推广
QQ:805874290

市场合作
zhongcong@henkuai.com