- 博客(14)
- 收藏
- 关注
RSS订阅原创 条件渲染与 picker 组件
通过本案例掌握了picker选择器的基本用法（range），以及wx:if条件渲染与<block>包裹标签的使用场景。扩展要求把选项从 3 种扩到 4 种，也加深了对 "数组驱动界面" 这一思路的理解 —— 加选项只需要往数组里加一个元素，界面自动跟着更新。
2026-10-20 14:03:02
135
原创 计时器：setInterval 倒计时与伪元素水印
通过本案例掌握了小程序中setTimeout和的使用方式，理解了定时器 "启动 — 运行 — 清理" 的完整生命周期，并学会用 CSS 伪元素::before不写额外标签就能生成装饰性背景文字。这是后续开发倒计时、验证码、自动轮播等功能的基础。
2026-10-20 13:51:56
176
原创 微信小程序案例 2.10 自动随机变化的颜色
通过本案例掌握了生成随机数、setData驱动视图更新、定时执行这三项核心技能，理解了小程序 "数据驱动界面" 的编程思想。扩展功能进一步巩固了多个数据项之间的联动关系 —— 标题颜色随第一行诗颜色同步变化，也提醒我们使用定时器时要在页面卸载时及时清理。
2026-10-13 14:34:37
218
原创 微信小程序案例 2.2 图片与声音：图片展示 + 音频播放控制
通过本案例掌握了image图片展示和音频播放的完整用法，理解了播放速率、播放位置等核心属性，并学会在播放 / 暂停事件中结合输出调试信息，为后续开发带音频的媒体类小程序打下基础。
2026-10-13 14:21:19
163
原创 image 组件：14 种图片显示模式演示
通过本案例系统掌握了image组件 14 种mode显示模式的差异，理解了缩放模式与裁剪模式的区别，并熟练运用wx:for把数据数组批量渲染成界面。新增的编号字段让每种模式一目了然，也加深了对数据驱动视图的理解。
2026-10-06 17:14:37
241
原创 swiper 与 switch 组件：开关控制轮播图
通过本案例掌握了swiper轮播图的常用属性（指示点、自动播放、衔接滑动、竖向），学会用switch开关配合bindchange实时修改数据，并通过数据绑定驱动 swiper 刷新。新增的第 4 个滑动项加深了对wx:for循环渲染的理解。
2026-10-06 17:10:52
232
原创 微信小程序案例 4.2 checkbox 与 radio 组件：动态控制字体样式
通过本案例掌握了多选与单选的用法，理解了两者事件回调中数组与单值的区别，并学会了在 WXML 中用做动态样式绑定，从而实现选择项实时驱动界面变化。新增的 30rpx 选项加深了对 radio 单选数据流的理解。
2026-09-29 15:15:31
184
原创 微信小程序案例 4.1 form 组件
通过本案例掌握了小程序 form 表单的提交与重置机制，理解了 input 的 name 属性和 e.detail.value 取值原理，学会用 wx.showToast 做用户提示，并用海伦公式完成了实际的计算小功能。新增的重置按钮加深了对 form-type="reset" 和 bindreset 事件的理解。
2026-09-29 15:11:06
171
原创 微信小程序案例 3.9 模板 template 的定义与引用
template 模板是小程序页面复用的基础方案，适合重复 UI 卡片。本案例实现两套独立模板，一套展示学生，一套展示奥运冠军，满足作业拓展要求。使用模板后，相同结构的卡片只需要写一次代码，后续修改样式只需要修改模板内部代码，大大简化开发维护。
2026-09-22 14:17:15
132
原创 微信小程序案例 3.8 模块化
通过本案例，掌握小程序 JS 模块化开发，学会使用 require 导入、module.exports 导出。模块化可以拆分复杂项目，实现代码复用。本次作业增加样式区分，直观看到不同模块输出内容，加深对模块化思想的理解，为后续复杂小程序项目开发打下基础。
2026-09-22 14:02:18
174
原创 【无标题】
本案例为微信小程序实训案例，学习小程序与应用App生命周期。生命周期就是页面从创建、显示、隐藏，到销毁的整个执行过程。运行项目后打开Console控制台，观察各个生命周期函数打印的日志，理解函数触发时机。
2026-09-20 14:11:09
167
原创 实现 5 个 Tab 底部导航栏
通过本案例掌握微信小程序底部标签 tabBar 的配置方式，理解全局配置文件 app.json 的作用，学会新增页面、扩展 tab 标签。tabBar 是小程序开发中非常常用的底部导航组件，绝大多数小程序都会使用。
2026-09-20 13:54:16
141
原创 【无标题】
本次实验完成微信小程序Flex弹性布局案例。Flex是前端常用弹性布局模型，可以快速实现一维方向的元素排列。本案例实现三组flex布局，并按作业要求，将第一行水平均匀布局修改为。
2026-09-16 12:15:11
191
原创 微信小程序实践：字体和文本样式属性
1. 静态样式尽量不要写在标签的 style 属性，抽离到wxss，通过class引用，做到结构与样式分离，方便后期维护。- class ：在wxss文件统一定义样式，wxml通过class调用，实现结构与样式分离，静态样式优先使用。3. 页面滚动：页面总高度大于手机屏幕高度，小程序原生自动开启滚动，不需要额外组件，填充大量内容即可实现。这里增加大量测试内容，用来让页面高度超过手机一屏，实现页面滚动效果。这里增加大量测试内容，用来让页面高度超过手机一屏，实现页面滚动效果。
2026-09-07 15:30:46
222
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人