音像小程序商城开发(界面设计实战)编者:华

前言
部　小程序基础
章　小程序起步2
1.1　开发准备2
1.2　个小程序5
1.3　代码构成5
1.3.1　JSON配置6
1.3.2　WXML模板7
1.3.3　WXSS样式9
1.3.4　.js本互逻辑9
1.4　小程序的能力10
1.5　小程序发布准备12
1.6　小程序上线13
第2章　小程序基础知识15
2.1　项目配置文件15
2.2　全局配置和页面配置17
2.2.1　全局配置18
2.2.2　页面配置
.　WXSS样式语言
2.4　逻辑层.js脚本25
2.4.1　App方法26
2.4.2　运行机制29
2.4.3　场景值30
2.4.4　Page方法32
2.4.5　路由40
2.4.6　模块化41
2.4.7　API42
2.5　WXML视图层开发43
2.5.1　数据绑定43
2.5.2　列表渲染47
2.5.3　条件渲染51
2.5.4　模板51
2.5.5　事件53
2.5.6　引用58
第二部分　小程序样式入门
第3章　小程序样式基础62
3.1　元素选择器62
3.2　选择器63
3.3　类选择器66
3.4　样式的几种写法67
3.4.1　Web中样式的几种写法67
3.4.2　小程序中样式的几种写法69
3.5　背景颜色70
3.6　文本71
3.6.1　水平对齐（text-align）71
3.6.2　文本行对齐（text-align-last）73
3.6.3　缩进文本（text-indent）73
3.6.4　文本装饰（text-decoration）75
3.6.5　单词间隔（text-justify）76
3.6.6　文本溢出（text-overflow）77
3.6.7　文本阴影（text-shadow）78
3.6.8　字符转换（text-transform）79
3.6.9　处理空白符（white-space）80
3.6.10　自动换行（word-break）80
3.6.11　长词换行（word-wrap）81
3.6.12　单词间隔（word-spacing）82
3.6.13　字母间隔（letter-spacing）83
3.6.14　文本方向（direction）84
3.7　字体85
3.7.1　字体大小（font-size）85
3.7.2　字体风格（font-style）87
3.7.3　字体变形（font-variant）88
3.7.4　字体加粗（font-weight）89
3.8　轮廓90
第4章　框模型93
4.1　框模型概述93
4.2　内边距96
4.3　边框98
4.3.1　基础语法98
4.3.2　小程序应用102
4.4　外边距103
4.5　外边距合并107
第5章　定位112
5.1　相对定位112
5.2　定位115
5.3　浮动117
第6章　选择器121
6.1　选择器的分组121
6.2　派生选择器122
6.3　属选择器1
6.4　后代选择器125
6.5　子元素选择器128
6.6　相邻兄弟选择器129
第三部分　前端开发入门
第7章　弹布局134
7.1　弹布局基本概念134
7.2　flex容器的属136
7.2.1　项目排列方向（flex-direction）136
7.2.2　项目换行（flex-wrap）139
7..　flex-flow属142
7.2.4　水平对齐（justify-content）142
7.2.5　垂直对齐（align-items）145
7.2.6　各行对齐（align-content）149
7.3　flex项目的属150
7.3.1　子元素的排序（order）150
7.3.2　放大比例（flex-grw）52
7.3.3　缩小比例（flex-shrink）155
7.3.4　项目占据的主轴空间（flex-basis）156
7.3.5　flex综合属设置156
7.3.6　子元素的对齐（align-self）157
7.3.7　对齐和居中（margin）158
7.4　flex布局样例160
第8章　JSON数据解析163
8.1　JSON简介163
8.2　JSON语法165
8.2.1　JSON语法规则165
8.2.2　JSON使用JavaScript语法166
8.3　JSON对象167
8.3.1　对象语法167
8.3.2　访问对象值方式1168
8.3.3　访问对象值方式2168
8.3.4　嵌套JSON对象169
8.3.5　修改值170
8.3.6　删除对象属171
8.4　JSON数组172
8.4.1　JSON对象中的数组172
8.4.2　数组的循环访问174
8.4.3　嵌套JSON对象中的数组175
8.4.4　修改数组值176
8.4.5　删除数组元素177
8.5　JSNparse()177
8.5.1　浏览器支持177
8.5.2　语法177
8.5.3　JSON解析实例177
8.5.4　从服务端接收JSON数据178
8.5.5　从服务端接收数组的JSON数据179
8.6　JSNstringify()转字符串180
8.6.1　JSNstringify()语法180
8.6.2　JavaScript对象转换180
8.6.3　JavaScript数组转换181
8.7　eval函数182
第9章　小程序前端开发基础184
9.1　常用数据184
9.1.1　变量184
9.1.2　对象185
9.1.3　数组186
9.2　逻辑语句188
9.2.1　if语句188
9.2.2　for语句190
9..　while语句191
9.2.4　switch和case语句192
9.3　193
9.3.1　事件的定义和使用193
9.3.2　通过url来传递参数194
第四部分　实战
0章　常用组件198
10.1　组件概要198
10.2　基础组件199
10.2.1　视图容器（view）199
10.2.2　可滚动视图区域（scroll-view）199
10..　滑块视图容器（swiper）200
10.2.4　图标（icon）201
10.2.5　文本（text）201
10.2.6　图片（image）202
10.3　表单组件203
10.3.1　按钮（button）203
10.3.2　多选项目（checkbox）205
10.3.3　多项选择器（checkbox-group）205
10.3.4　表单（form）206
10.3.5　输入框（input）206
10.3.6　标签（label）208
10.3.7　滚动选择器（picker）208
10.3.8　单选项目（radi）20
10.3.9　单项选择器（radio-group）211
10.3.10　滑动选择器（slider）211
10.3.11　开关选择器（switch）211
10.3.12　多行输入框（textarea）212
10.4　213
10.4.1　页面链接（navigator）213
10.4.2　原生组件的使用限制214
1章　常用API215
11.1　网络相关说明215
11.1.1　网络配置215
11.1.2　HTTPS网络请求217
11.2　手机相关的API219
11.2.1　wx.chooseImage219
11.2.2　wx.getSystemInfo220
11..　wx.makePhoneCall221
11.3　数据缓存API221
11.3.1　wx.setStorage221
11.3.2　wx.setStorageSync222
11.3.3　wx.getStorage222
11.3.4　wx.getStorageSync2
11.3.5　wx.getStorageInfo2
11.3.6　wx.removeStorage224
11.3.7　wx.clearStorage225
11.4　交互API225
11.4.1　wx.showToast225
11.4.2　wx.hideToast226
11.4.3　wx.showLoading227
11.4.4　wx.hideLoading227
11.4.5　wx.showActionSheet227
11.4.6　wx.showModal228
11.5　路由API229
11.5.1　wx.navigateTo229
11.5.2　wx.navigateBack0
11.5.3　wx.redirectTo0
11.5.4　wx.reLaunch1
11.5.5　wx.switchTab1
2章　首页
12.1　商城框架
12.2　顶部广告图片4
1.　顶部轮播图片
12.4　快捷菜单
12.5　通知244
12.6　产品248
12.7　精品255
12.8　销售排行260
3章　分类和产品265
13.1　左右布局框架265
13.1.1　布局分析265
13.1.2　功能实现266
13.2　产品列表272
13.2.1　顶部查询布局272
13.2.2　条件筛选布局274
13..　产品列表布局276
13.3　产品页面顶部切换功能278
13.4　产品页面底部功能281
13.5　产品简介布局284
13.6　产品详情页布局288
13.7　产品评价页布局289
4章　购物车和293
14.1　购物车首页底部菜单293
14.2　购物车产品列表295
14.3　页面底部菜单298
14.4　页面收货地址300
14.5　页面的产品列表和留言302
5章　会员界面305
15.1　会员首页305
15.2　我的订单308
15.3　收货地址列表312
15.4　收货地址修改和新增314
15.5　我的收藏318
15.6　常见问题列表321
15.7　联系客服3
6章　公用功能326
16.1　留言反馈326
16.2　活动信息列表329
16.3　帮中心列表332
16.4　关于我们列表334
16.5　信息详情（简易版）335
16.6　信息详情（带底部评论）337
7章　杂项知识341
17.1　WeUI341
17.1.1　实战项目框架的制作342
17.1.2　栏目首页343
17.1.3　article文章345
17.1.4　badge徽章347
17.2　WxParse解析富文本（html）代码348