微信小程序--原生

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;
}

2:总结

11:页面导航

什么是页面导航

1:小程序中实现页面导航的两种方式

1:声明式导航

1:声明式导航跳转到tabBar页

2:声明式导航跳转到非tabBar页

3:声明式导航--后退

2:编程式导航

1:编程式导航跳转到tabBar页

2:编程式导航跳转到非tabBar页

3:编程式导航--后退

2:导航传参

1:声明式导航传参

2:编程式导航传参

3:在onLoad中接收导航参数

12:页面事件

1:下拉刷新

1:什么是下拉刷新

2:启用下拉刷新

3:配置下拉刷新窗口的样式

4:监听页面的下拉刷新事件

5:停止下拉刷新的效果(下拉后不会自己恢复,需要手动恢复)

2:上拉触底

1:什么是上拉触底

2:监听页面的上拉触底事件

3:配置上拉触底的距离

4:上拉触底的案例

1:案例效果展示

2:案例的实现步骤

3:步骤1-定义获取随机颜色的方法

4:步骤2-在页面加载时获取初始数据

5:步骤3-渲染ui解构并美化页面效果

6:步骤4-上拉触底时获取随机颜色

7:步骤5-添加上拉加载的样式效果

8:步骤6-对上拉触底进行节流处理

3:自定义编译模式

13:生命周期

1:什么是生命周期

2:生命周期的分类

3:什么是生命周期函数

4:生命周期函数的分类

5:小程序中的应用生命周期函数

6:小程序中页面上的生命周期函数

14:wxs脚本

1:什么是wxs

2:wxs的应用场景

15:实现案例--本地生活列表页

相关推荐
Bruce_Liuxiaowei4 小时前
农历节日倒计时:基于Python的公历与农历日期转换及节日查询小程序
python·小程序·节日
然后就去远行吧7 小时前
小程序基础 —— 02 微信小程序账号注册
微信小程序·小程序
爱吃鱼的酱酱仔7 小时前
uniapp实现APP、小程序与webview页面间通讯
小程序·uni-app
科技小E8 小时前
NVR小程序接入平台EasyNVR视频监控技术如何助力餐饮行业实现明厨亮灶
安全·小程序·音视频·视频监控
xiangxiongfly9159 小时前
微信小程序之async-validator
微信小程序·小程序·validator·async-validator
说私域11 小时前
关键客户转化为会员的重要性及 “开源 AI 智能名片 2 + 1 链动模式商城小程序” 在其中的应用剖析
人工智能·小程序
ai安歌11 小时前
【微信小程序】微信小程序中的异步函数是如何实现同步功能的
微信小程序·小程序·同步·异步
weixin_4825655312 小时前
Android IC读写器安卓小程序 3
android·小程序
guanpinkeji16 小时前
旧衣回收小程序开发,绿色生活,便捷回收
小程序·生活·小程序开发·小程序制作·回收小程序·回收·旧衣回收
jiejianyun85716 小时前
上门回收小程序如何搭建?有个小程序收破烂也要高端?
服务器·小程序·apache