微信小程序开发必备100Tip.pdf

CMYCMMYCYCMYK微信小程序开必100Tipfy.pdf 1 2017/9/13 9:24:43 内 容 简 介 本书提供了微信小程序开发必备的 100 个 Tip 和一个完整的电商案例京东购物微信小程序，100 个 Tip分为四类：关于微信小程序的框架及工具 16 个 Tip、关于微信小程序丰富的组件 24 个 Tip、关于微信小程序必备 API 技能 50 个 Tip、关于微信小程序高级交互设计 10 个 Tip，每一个 Tip 都会有详细的介绍和相关的示例，方便开发人员快速学习这些 Tip，同时也可以作为工具书指南进行查询，应用到哪个知识点可以到这里快速的查询进行使用。京东购物微信小程序是综合应用这些 Tip，将这些 Tip 综合应用到实际项目开发过程中。通过学习 100 个 Tip 和项目案例，让读者全面、深入、透彻地理解微信小程序开发，提高微信小程序开发能力和项目实战能力。本书内容丰富，实例典型，实用性强，适合各个层次想要学习微信小程序开发技术的人员阅读，本书也可以作为微信小程序开发查询工具书使用，方便快速查询微信小程序开发所应用到的知识点。未经许可，不得以任何方式复制或抄袭本书之部分或全部内容。版权所有，侵权必究。图书在版编目（CIP）数据 微信小程序开发必备 100Tip/刘刚编著.北京：电子工业出版社，2017.10 ISBN 978-7-121-32691-2.微.刘.移动终端应用程序程序设计.TN929.53 中国版本图书馆 CIP 数据核字(2017)第 223271 号 责任编辑：安 娜 印 刷：装 订：出版发行：电子工业出版社 北京市海淀区万寿路 173 信箱 邮编：100036 开 本：787980 1/16 印张：23.5 字数：438 千字 版 次：2017 年 10 月第 1 版 印 次：2017 年 10 月第 1 次印刷 定 价：75.00 元 凡所购买电子工业出版社图书有缺损问题，请向购买书店调换。若书店售缺，请与本社发行部联系，联系及邮购电话：（010）88254888，88258888。质量投诉请发邮件至 ，盗版侵权举报请发邮件至 。本书咨询联系方式：010-51260888-819，。前 言 III 前前 言言 为什么要写这本书？微信小程序从正式发布后越来越受很多软件公司和开发人员的使用，目前图书市场上关于微信小程序的书籍还很匮乏，真正能把微信小程序开发必备技能提炼出来的少之又少，本书提供了微信小程序开发必备的 100 个 Tip 和一个完整的电商案例京东购物微信小程序。100 个 Tip 分为四类：关于微信小程序的框架及工具 16 个 Tip；关于微信小程序丰富的组件 24 个 Tip 关于微信小程序必备 API 技能 50 个 Tip；关于微信小程序高级交互设计 10 个 Tip。每一个 Tip 都有详细的介绍和相关的示例，方便开发人员快速学习这些 Tip，同时也可以作为工具书指南进行查询，应用到哪个知识点可以到这里快速查询并使用。京东购物微信小程序是将这些 Tip 综合应用到实际项目开发过程中。通过学习 100 个 Tip 和项目案例，让读者全面、深入、透彻地理解微信小程序开发，提高微信小程序开发能力和项目实战能力。本书有何特色？1.图文结合方式，逐步讲解 为了便于读者理解本书内容，提高学习效率，作者通过文字讲解及图表演示，逐步操作，避免枯燥乏味。2.提炼知识点、方便快速学习 本书针对微信小程序的框架和工具、组件、API、交互效果共提炼出 100 个常用开发IV 微信小程序开发必备 100 Tip Tip，每个 Tip 都有详细的示例或者实际应用的场景，方便读者快速学习和查阅使用。3.由浅入深、理论与实战相结合 本书先讲解100个常用开发Tip，从框架和工具的使用到组件的使用，然后是常用API，再后是高级交互效果，最后使用一个完整案例贯穿知识点，由浅入深，一步步掌握微信小程序的开发。4.实战驱动，应用性强 本书每个开发 Tip 都有详细的示例或者实际应用场景，读者可根据示例快速进行知识点的学习和使用，通过知识点在实际场景的应用，指引读者在项目实战过程中如何应用这些 Tip。5.项目案例典型，实战性强，有较高的应用价值 本书提供了有代表性的高级交互效果和完整的典型案例。读者在实际项目开发过程中，可参考这些案例，缩短开发时间。6.提供完善的技术支持和售后服务 本书提供了专门的技术支持邮箱：yuan_kevin_，读者在阅读本书过程中如有任何疑问都可以通过该邮箱获得帮助。本书内容及知识体系 第 1 章 微信小程序的框架及工具 本章介绍了微信小程序的框架及工具使用 Tip 15 个，详细讲解了微信小程序框架和工具的使用，是小程序入门必备的知识点。第 2 章 微信小程序的丰富的组件 本章介绍了微信小程序组件的使用 Tip 26 个，详细介绍了每个组件的使用以及实际项目应用场景，是小程序界面开发必备的知识点。第 3 章 微信小程序必备 API 技能 本章介绍了微信小程序 API 使用 Tip 49 个，详细介绍微信小程序常用 API 的使用，是小程序进行界面与后台逻辑处理开发必备的知识点。第 4 章 微信小程序高级交互设计 本章介绍了微信小程序高级交互设计 Tip 10 个，介绍了 10 类高级交互效果，是小程序交互设计必备的知识点。前 言 V 第 5 章 京东购物微信小程序案例 本章详细讲解了微信小程序的一个典型案例，通过对案例的学习，读者可掌握各个知识点的应用以及实际项目的开发过程和设计思路。适合阅读本书的读者 微信开发者 前端开发工程师 学生 网站站长、待业青年 阅读本书的建议 本书可以作为工具书使用，查询各个知识点、交互效果的使用。没有基础的读者，可以按照章节顺序进行学习，由浅入深，逐个突破。有一定基础的读者，可以根据实际情况有重点地选择阅读各个模块和项目案例。对于每一个模块和项目案例，先自己思考一下实现的思路，然后再阅读，学习效果会更好。轻松注册成为博文视点社区用户（），扫码直达本书页面。提交勘误：您对书中内容的修改意见可在 提交勘误 处提交，若被采纳，将获赠博文视点社区积分（在您购买电子书时，积分可用来抵扣相应金额）。交流互动：在页面下方 读者评论 处留下您的疑问或观点，与我们和其他读者一同学习交流。页面入口：http:/ VI 微信小程序开发必备 100 Tip 目目 录录 第 1 章 微信小程序的框架及工具.1 1.1 app.json 配置.11.1.1 决定页面文件路径.2 1.1.2 配置窗口表现.3 1.1.3 配置 tab 标签导航.5 1.1.4 设置网络超时时间.8 1.1.5 配置 debug 模式.9 1.2 App()函数使用.101.3 Page()函数使用.121.3.1 初始化数据.13 1.3.2 生命周期函数.13 1.3.3 相关事件函数.14 1.4 数据绑定.141.5 wx:if 条件判断.151.6 wx:for 列表渲染.161.7 定义和使用模板.171.8 import 引用模板.181.9 include 引用文件.191.10 Console 面板.201.11 Sources 面板.211.12 Network 面板.221.13 Storage 面板.241.14 Appdata 面板.24目 录 VII 1.15 Wxml 面板.261.16 Sensor 面板.27第 2 章 微信小程序丰富的组件.28 2.1 view 视图容器组件.282.2 scroll-view 可滚动视图容器组件.312.3 swiper 滑块视图容器组件.342.3.1 海报轮播效果.35 2.3.2 页签切换效果.36 2.4 movable-view 可移动的视图容器组件.402.5 icon 图标组件.422.6 text 文本组件.442.7 progress 进度条组件.452.8 button 按钮组件.462.9 checkbox 多项选择器组件.482.10 radio 单项选择器组件.572.11 input 单行输入框组件.592.12 textarea 多行输入框组件.612.13 label 改进表单组件.632.14 picker 选择器组件.702.14.1 picker 普通选择器组件.71 2.14.2 picker 时间选择器组件.73 2.14.3 picker 日期选择器组件.74 2.15 picker-view 嵌入页面的滚动选择器.762.16 slider 滑动选择器组件.782.17 switch 开关选择器组件.802.18 form 表单组件.852.19 navigator 页面链接导航组件.922.20 audio 音频组件.952.21 image 图片组件.1022.22 video 视频组件.1042.23 map 地图组件.1062.24 canvas 画布组件.112VIII 微信小程序开发必备 100 Tip 第 3 章 微信小程序必备 API 技能.118 3.1 wx.request 发起网络请求.1183.2 wx.uploadFile 上传文件.1223.3 wx.downloadFile 下载文件.1233.4 WebSocket 会话连接.1253.5 wx.chooseImage 选择图片.1333.6 wx.previewImage 预览图片.1343.7 wx.getImageInfo 获取图片信息.1353.8 wx.saveImageToPhotosAlbum 保存图片到相册.1363.9 wx.startRecord 开始录音和 wx.stopRecord 结束录音.1383.10 voice 音频播放控制.1393.11 wx.createAudioContext 音频组件控制.1403.12 wx.playBackgroundAudio 播放音乐.1413.13 wx.seekBackgroundAudio(OBJECT)控制音乐播放进度.1433.14 wx.getBackgroundAudioPlayerState 获取音乐播放状态.1433.15 wx.createVideoContext(videoId)视频组件控制.1453.16 wx.chooseVideo(OBJECT)选择视频.1463.17 wx.saveVideoToPhotosAlbum 保存视频到相册.1473.18 wx.saveFile 保存文件.1483.19 wx.getSavedFileList 获取本地文件列表.1493.20 wx.getSavedFileInfo 获取本地文件信息.1513.21 wx.removeSavedFile 删除本地文件.1533.22 wx.openDocument 打开文档.1543.23 wx.setStorage 和 wx.setStorageSync 本地数据缓存.1553.24 wx.getStorage 和 wx.getStorageSync 获取本地数据缓存.1573.25 wx.getStorageInfo 和 wx.getStorageInfoSync 获取缓存信息.1593.26 清理本地缓存数据.1613.27 wx.getLocation 获取位置.1623.28 wx.chooseLocation 选择位置.1673.29 wx.openLocation 打开内置地图.1683.30 获取设备系统信息.1693.31 获取网络状态.1723.32 wx.onAccelerometerChange 加速度计.172目 录 IX 3.33 wx.onCompassChange 监听罗盘数据.1733.34 wx.makePhoneCall 拨打电话和 wx.scanCode 扫码.1733.35 剪贴板和屏幕亮度.1753.36 wx.addPhoneContact 添加联系人