小程序中页面和组件的区别

页面包含组件,组件依赖页面存在

1.生命周期对比

== 页面(Page):小程序的独立路由单元,是用户可直接访问的完整页面(如登录页、首页),对应一个 pages/ 目录下的页面配置 ==

== 组件(Component):可复用的 UI / 逻辑单元,嵌入在页面或其他组件中,不能独立访问(如弹窗、选择器、列表项),对应 components/ 目录。==

2.目录对比
3.页面中使用组件时【运行加载过程】
  • 生命周期执行顺序:

页面 onLoad → 页面 onShow → 组件 created → 组件 attached → 页面 onReady → 组件 ready。

  • 数据通信:

页面 → 组件:通过 properties 传值(如 title="{{cardTitle}}");

组件 → 页面:通过 triggerEvent 触发自定义事件(如 bind:cardClick)。

  • 方法定义:

页面方法直接写在 Page({}) 中;

组件方法必须放在 methods: {} 内。

  • 路由与访问

页面:可通过 wx.navigateTo、wx.switchTab 等 API 跳转,有独立 URL。

组件:无路由概念,只能通过 标签嵌入到页面或其他组件中。

最后:代码层面回顾


相关推荐
言乐613 小时前
Python实现可运行解密游戏游戏框架
python·游戏·小程序·游戏程序·关卡设计
2501_915106321 天前
iOS 软件测试工具性能监控、日志分析 KeyMob、Instruments等
android·ios·小程序·https·uni-app·iphone·webview
云迈科技-软件定制开发1 天前
2026 AI智能体小程序APP开发怎么做:从场景规划到上线交付的完整参考
大数据·人工智能·小程序
小码哥0681 天前
医院陪诊小程序怎么开发-医院陪诊小程序源码功能-微信小程序 医院健康陪诊陪护系统
微信小程序·小程序·医院陪诊·陪诊系统·陪诊陪诊
黄华SJ520it2 天前
柯尔嫚商城模式开发:从概念到实现的完整指南
小程序·系统开发
黄华SJ520it3 天前
线上线下多门店融合系统开发指南
小程序·系统开发
一孤程4 天前
Airtest自动化测试第五篇:小程序与Web测试——跨平台自动化全覆盖
前端·自动化测试·小程序·自动化·测试·airtest
CRMEB定制开发4 天前
开源商城源码下载后怎么搭建?五步走通完整流程
小程序·开源·商城系统·私域运营
小羊Yveesss4 天前
2026年如何自己搭建一个外贸网页?单页验证和完整网站的区别
微信小程序·小程序·开源
weishuangyun1234 天前
怎么开发自己的小程序?2026 三种主流方式实测对比
小程序