小程序开发学习记录——页面导航、页面事件、生命周期、WXS脚本

最新推荐文章于 2025-07-22 16:38:13 发布
最新推荐文章于 2025-07-22 16:38:13 发布
阅读量240 收藏
点赞数
CC 4.0 BY-SA版权
分类专栏： 微信小程序 文章标签： 学习 前端 微信小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/spring0205/article/details/124840618
本文深入探讨了小程序中的声明式和编程式导航，包括如何导航到tabBar和非tabBar页面，以及参数传递。同时，详细介绍了页面的下拉刷新和上拉触底事件的配置与监听。此外，还涵盖了小程序页面的生命周期函数及其使用，以及WXS脚本的基础知识和特点。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

页面导航

声明式导航

在页面上声明一个导航组件
通过点击组件实现页面跳转

导航到tabBar页面

在这里插入图片描述

导航到非tabBar页面

在这里插入图片描述
为了简便
在这里插入图片描述

后退导航

在这里插入图片描述
在这里插入图片描述

编程式导航

调用小程序导航的API 实现页面跳转

导航到tabBar界面

在这里插入图片描述

导航到非tabBar界面

在这里插入图片描述

后退导航

在这里插入图片描述

导航传参

声明式导航传参

在这里插入图片描述
在这里插入图片描述

编程式导航传参

在这里插入图片描述

导航传参

在这里插入图片描述
在这里插入图片描述

页面事件

下拉刷新事件

是移动端的专有名词，指的是通过手指在屏幕上的下拉滑动操作，从而重新加载页面数据的行为

全局开启下拉刷新

在这里插入图片描述

局部开启下拉刷新

在这里插入图片描述

下拉刷新窗口的样式

在这里插入图片描述

监听页面的下拉刷新事件

在这里插入图片描述

停止下拉刷新的效果

在这里插入图片描述

上拉触底事件

上拉触底是移动端的专有名词 通过手指在屏幕上的上拉动作 从而加载更多数据的行为
在这里插入图片描述

监听页面的上拉触底事件

在这里插入图片描述

配置上拉触底的距离

在这里插入图片描述

生命周期

生命周期的分类

在这里插入图片描述

生命周期函数

在这里插入图片描述

生命周期函数分类

在这里插入图片描述

应用生命周期函数

在这里插入图片描述

页面生命周期函数

在这里插入图片描述

WXS脚本

在这里插入图片描述

wxs和javaScript之间的关系

在这里插入图片描述

基础语法

内嵌的wxs脚本

在这里插入图片描述

外联的wxs脚本

在这里插入图片描述
在这里插入图片描述

wxs的特点

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

小程序开发踩坑记——初识小程序
qq_40903080的博客
08-23 433
小程序开发踩坑记——初识小程序 前言 暑假期间做了一个小程序，一个专属于我们学校学生的小程序。这也算我自从学习前端以来第一次自己独立前后端兼顾开发的项目了。由于当初给自己立的flag是在8月22日之前完成，正好今天将最后一些小bug给修复了，然后已经上交审核了。暑假的剩下几天时间，打算把小程序开发过程中的一些心得体会写下来，也算为以后自己的开发提供一些帮助。 初识小程序 之前是从vue开始接触的前...
小程序源码
03-14
总之，"小程序源码"是一个实践微信小程序开发的宝贵资源，通过学习和研究这个源码，开发者不仅可以掌握微信小程序的开发技术，还能深入了解前端开发的实践策略和设计模式。对于想要入行小程序开发的人员来说，这是一...
【微信小程序前端开发】入门Day03 —— 页面导航、事件、生命周期、WXS 脚本及自定义组件
2303_76696898的博客
10-02 2926
本文详细介绍了小程序开发中的多个关键知识点，包括页面导航（声明式和编程式导航及传参）、页面事件（下拉刷新和上拉触底）、生命周期（应用和页面生命周期函数）、WXS 脚本（概述、基础语法和特点）以及自定义组件（创建、引用、样式、数据、监听器、生命周期、插槽和父子通信等）
【小程序 - 基础】页面导航、页面事件、生命周期、WXS脚本_04
青春木鱼的博客
10-01 1429
【小程序】页面导航、页面事件、生命周期、WXS脚本
微信小程序（页面导航、页面事件、生命周期、WXS脚本）
ZHAOKAIYUR的博客
03-14 628
黑马程序员，学习记录黑马程序员前端微信小程序开发教程，微信小程序从基础到发布全流程_企业级商城实战分类应用生命周期函数/*** 当小程序初始化完成时，会触发 onLaunch（全局只触发一次）} , /*** 当小程序启动，或从后台进入前台显示，会触发 onShow} , /*** 当小程序从前台进入后台，会触发 onHide} , /*** 当小程序发生脚本错误，或者 api 调用失败时，会触发 onError 并带上错误信息} })页面生命周期函数Page({/**
微信小程序——生命周期，生命周期的分类，页面生命周期，生命周期函数的分类，应用的生命周期函数，页面的生命周期函数，wxs脚本概述
WZY22502701的博客
01-29 2917
生命周期函数：是由小程序框架提供的内置函数，会伴随着生命周期，自动按次序执行。生命周期函数的作用：允许程序员在特定的时间点执行某些特定的操作。例如，页面刚加载的时候，可以在 onLoad 生命周期函数中初始化页面的数据。注意：生命周期强调的是时间段，生命周期函数强调的是时间点。什么是wxswxs ( WeiXin Script ）是小程序独有的一套脚本语言，结合 WXML ，可以构建出页面的结构。
微信小程序学习第6天——生命周期函数与WXS脚本
背心的博客
02-05 605
生命周期函数与WXS脚本
微信小程序开发实战 ⑩③（WX周期及WXS脚本）
m0_61490399的博客
10-05 2579
WXS（WeiXin Script）是小程序独有的一套脚本语言，结合 WXML，可以构建出页面的结构。wxs 代码还可以编写在以 .wxs 为后缀名的文件内，就像 javascript 代码可以编写在以 .js 为后缀名的文件中一样。本文到这里就结束了,大佬们的支持是我持续更新的最大动力，希望这篇文章能帮到大家💪相关专栏连接🔗下篇文章再见ヾ(￣▽￣)ByeByeHomePage社区链接🔗专栏连接🔗。
微信小程序8——生命周期与wxs
Phoenix1st的博客
02-10 477
简要介绍微信小程序的生命周期函数和wxs的用法
小程序学习——day3
m0_69380938的博客
08-02 2386
指的是页面间的相互跳转，小程序实现页面导航有两种方式。
微信小程序学习总结——③
qq_45947850的博客
06-06 1265
微信小程序学习日记
微信小程序入门.docx
10-05
- `app.js`：小程序逻辑代码，管理整个小程序的生命周期。 - `app.json`：全局配置文件，包括页面路径、窗口表现、网络超时时间等。 - `app.wxss`：全局样式表，定义小程序的公共样式。 2. **页面文件**： - 每...
微信小程序开发框架及资源汇总整理
- **小程序的生命周期**：开发者需要了解小程序的生命周期函数，例如onLaunch（小程序启动时触发）、onShow（小程序显示时触发）和onHide（小程序隐藏时触发）等。 - **WXML（WeiXin Markup Language）**：类似HTML...
【Linux】重生之从零开始学习运维之Mysql安装
qq_40427704的博客
07-21 255
【代码】【Linux】重生之从零开始学习运维之Mysql安装。
Python编程进阶知识之第二课学习网络爬虫（selenium）
m0_74977182的博客
07-18 1385
selenium库是一种用于 Web 应用程序测试的工具，它可以驱动浏览器执行特定操作，自动按照脚本代码做点击、输入、打开、验证等操作，支持的浏览器包括 IE、Firefox、Safari、Chrome、Opera 等。而在办公自动化中如果经常需要使用浏览器操作某些内容，就可以使用selenium库来实现，例如将大量数据上传到网页中，与requests库不同的是，selenium库是基于浏览器的驱动程序来驱动浏览器执行操作的。且浏览器可以渲染网页代码，因此通过selenium。
C++编程学习（第13天）
最新发布
醉后不知天在水，满船清梦压星河。
07-22 804
C++的选择结构
学习小结记录
A57645467的博客
07-22 533
1、首先客户端位置是一台电脑或手机，在打开浏览器以后，比如输入http://www.zdns.cn的域名，它首先是由浏览器发起一个DNS解析请求，如果本地缓存服务器中找不到结果，则首先会向根服务器查询，根服务器里面记录的都是各个顶级域所在的服务器的位置，当向根请求http://www.zdns.cn的时候，根服务器就会返回.cn服务器的位置信息。2、递归服务器拿到.cn的权威服务器地址以后，就会寻问cn的权威服务器，知不知道http://www.zdns.cn的位置。
学习日志7.21
2301_80146401的博客
07-21 471
本文摘要介绍了数据报表处理中的关键函数和美化技巧。主要内容包括：1）常用聚合函数（SUM、AVG、MAX等）及日期处理方法；2）SUMIF、SUMIFS等条件函数的应用；3）环比、同比的计算方法；4）数据验证和错误处理技巧；5）报表美化三要素（字体调整、边框划分、条件格式）；6）双表美化步骤和汇报格式建议。重点强调了函数语法、常见错误规避以及通过格式优化提升报表可读性的实用技巧。
Git核心功能简要学习
qq_51013517的博客
07-21 159
git clone 下载，（注意：直接下载压缩包不会维护git init相关信息）git branch -a 查看有那些分支 （不同仓库可能有稳定版本和开发版本）git fetch：从远程仓库下载最新的提交记录和分支信息（但不会自动合并）。git checkout <branch name> 切换到那个分支。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值