1:数据绑定
1:数据绑定的基本原则
2:在data中定义页面的数据
3:Mustache语法
4:Mustache的应用场景
1:常见的几种场景
2:动态绑定内容
3:动态绑定属性
4:三元运算
4:算数运算
2:事件绑定
1:什么是事件
2:小程序中常用的事件
3:事件对象的属性列表
4:target和currentTarget的区别
5:bindtap的语法格式
6:在数据处理函数中为data中的数据赋值
7:事件传参
8:bindinput的语法格式
9:实现文本框和data之间的数据同步
1:定义数据
2:渲染结构
3:美化样式
4:绑定input事件处理函数
3:条件渲染
1:wx:if与wx:elif和wx:else
2:结合<biock>标签使用wx:if
3:hidden
3:wx:if与hidden的对比
1:运行方式不同
2:使用场景
4:列表渲染
1:wx:for
2:手动指定索引和当前项的变量名*(*了解就行)
3:wx:key的使用
5:模板样式
1:什么是wxss
2:wxss和css之间的关系(wxss扩展的特性)
1:rpx尺寸单位
1:什么是rpx尺寸单位
2:rpx的实现原理
3:rpx与px之间的单位换算*(*了解就行)
2:@import的语法格式
6:全局样式和局部样式
1:全局样式
2:局部样式
7:全局配置
1:全局配置文件及常用的配置项
1:window
2:了解window节点常用配置项
3:设置导航栏的标题
4:设置导航栏的背景色(只支持16进制的颜色--#ccc)
5:设置导航栏的标题颜色
6:全局开启下拉刷新的功能
7:设置下拉刷新时窗口的背景色(只支持16进制的颜色--#ccc)
8:设置下拉刷新时 loading的样式
9:设置上拉触底的距离
10:什么是tabBar
11:tabBar的六个组成部分
11:tabBar节点的配置项
12:每个tab项的配置选项
2:实例配置tabBar
1:需求描述
2:实现步骤
3:步骤1-拷贝图标资源
4:步骤2-新建几个对应的tab页面
5:步骤3-配置tabbar选项
6:tabBar 页面展示效果
8:页面配置
1:页面配置文件的作用
2:页面配置和全局配置的关系
3:页面配置中常用的配置项
9:网络数据请求
1:小程序中网络数据请求的限制
2:配置request合法域名
3:发起get请求
4:发起post请求
5:在页面刚加载时请求数据
6:调过request合法域名校验
7:关于跨域和Ajax的说明
10:实现案例--本地生活的首页
1:效果以及实现步骤
1:新建项目并梳理项目解构
2:配置导航栏效果
3:配置tabBar效果
4:实现轮播图效果
1:js部分
2:html部分
5:实现九宫格效果
1:js部分
2:html部分
6:实现底部两个链接
1:html部分
<!-- 图片区域链接 -->
<view class="flexE colorW marginTB20">
<view class="bgred W45 lineH200 flexCenter borderRa">
商家推荐
</view>
<view class="bgblue W45 lineH200 flexCenter borderRa">
交友论坛
</view>
</view>
2:css部分
.flexE{
display: flex;
justify-content: space-evenly;
}
.colorW{
color: white;
}
.bgred{
background-color: rgb(255, 128, 128);
}
.bgblue{
background-color: rgb(133, 133, 255);
}
.W45{
width: 45%;
}
.lineH200{
height: 200rpx;
}
.marginTB20{
margin-top: 20rpx;
}
.flexCenter{
display: flex;
justify-content: center;
align-items: center;
}
.borderRa{
border-radius: 8rpx;
}