news 2026/4/29 22:45:05

wx微信小程序部分逻辑

作者头像

张小明

前端开发工程师

1.2k 24
文章封面图
wx微信小程序部分逻辑

微信小程序的逻辑层(App Service)概述

微信小程序的框架分为**视图层(View)逻辑层(App Service)**两部分。其中,逻辑层负责处理业务逻辑、数据处理和事件响应,是小程序的核心“大脑”。

  • 逻辑层的作用

    • 使用 JavaScript 编写,处理数据后通过setData发送给视图层更新界面。
    • 接收视图层的事件反馈(如用户点击、输入等)。
    • 所有代码最终打包成一个 JavaScript 文件,在小程序启动时运行,直至销毁(类似 ServiceWorker)。
  • 与普通 JavaScript 的区别

    • 不支持浏览器对象(如windowdocument)。
    • 增加了小程序专有功能:
      • App()Page()方法:用于注册小程序和页面。
      • getApp()getCurrentPages():获取全局实例和页面栈。
      • 丰富的微信 API(如wx.requestwx.loginwx.pay等)。
1. 注册小程序(App)

app.js中使用App()注册,整个小程序只有一个 App 实例,全页面共享。

// app.jsApp({onLaunch(options){// 小程序启动时触发(只触发一次)console.log('小程序启动',options);},onShow(options){// 从后台进入前台时触发},onHide(){// 从前台进入后台时触发},globalData:{// 全局数据,所有页面可通过 getApp() 访问userInfo:null}});

获取全局实例:

constapp=getApp();console.log(app.globalData);
2. 注册页面(Page)

每个页面在自己的.js文件中使用Page()注册。

// pages/index/index.jsPage({data:{// 页面初始数据(会绑定到视图层)message:'Hello World',list:[1,2,3]},onLoad(options){// 页面加载时触发},onReady(){// 页面初次渲染完成},onShow(){// 页面显示},onHide(){// 页面隐藏},onUnload(){// 页面卸载},handleTap(e){// 事件处理函数(视图层绑定 bindtap="handleTap")this.setData({message:'Clicked!'});}});
  • 数据更新:使用this.setData({ key: value })更新数据,视图层自动刷新。
3. 业务逻辑处理示例
  • 网络请求(常见业务逻辑):
wx.request({url:'https://api.example.com/data',success(res){this.setData({list:res.data});}});
  • 事件处理:视图层通过bindtapbindinput等绑定事件,逻辑层处理用户交互。

  • 模块化:可以将公共逻辑导出为模块。

// utils/util.jsmodule.exports={formatTime:function(time){...}};// 在页面中使用constutil=require('../../utils/util.js');
4. 注意事项
  • 逻辑层和视图层通信通过微信 Native 中转(双线程架构),确保性能。
  • 避免在逻辑层直接操作 DOM(不支持)。
  • 复杂业务建议拆分成组件或云函数(云开发)处理。

如果你的问题是关于微信小程序中具体某个部分的业务逻辑(如登录、支付、列表渲染等),或者有代码片段需要解释/优化,请提供更多细节,我可以给出针对性的示例!

版权声明: 本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若内容造成侵权/违法违规/事实不符,请联系邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
网站建设 2026/4/30 11:41:41

JavaScript 有哪些数据类型?它们在内存里是怎么存的?

JavaScript 的数据类型 JavaScript 是动态类型语言,变量类型由值决定。根据 ECMAScript 规范,JavaScript 有 8 种数据类型(ES2020 后 BigInt 加入): 1. 基本数据类型(Primitive Types,共 7 种…

作者头像 李华
网站建设 2026/4/29 23:30:55

YOLO模型热更新机制:GPU服务不停机升级

YOLO模型热更新机制:GPU服务不停机升级 在现代工业视觉系统中,产线摄像头每秒都在生成海量图像数据,任何一秒的中断都可能导致成百上千件产品的检测遗漏。而与此同时,AI团队刚刚优化完一个新版本的YOLO模型——它在低光照场景下的…

作者头像 李华
网站建设 2026/4/27 3:31:43

YOLO模型训练成本太高?试试按Token付费的新模式

YOLO模型训练成本太高?试试按Token付费的新模式 在智能制造工厂的质检线上,一台工业相机每秒拍摄数十张PCB板图像,系统需要实时判断是否存在焊点虚焊、元件缺失等问题。传统做法是部署本地GPU服务器运行YOLO模型进行推理——但设备采购、环境…

作者头像 李华
网站建设 2026/4/27 3:31:17

学长亲荐10个AI论文软件,本科生轻松搞定毕业论文!

学长亲荐10个AI论文软件,本科生轻松搞定毕业论文! 从论文焦虑到轻松应对,AI 工具如何成为你的得力助手? 在当今学术环境中,撰写一篇高质量的毕业论文已经成为本科生不得不面对的挑战。无论是选题、资料收集、结构安排&…

作者头像 李华
网站建设 2026/4/30 15:36:42

YOLO模型镜像内置Profiler,一键诊断GPU性能瓶颈

YOLO模型镜像内置Profiler,一键诊断GPU性能瓶颈 在智能制造工厂的视觉质检线上,一台搭载YOLOv8m模型的工控机突然出现帧率暴跌——原本稳定的3ms/帧飙升至8ms,产线节拍被迫拉长。工程师紧急介入,却苦于缺乏有效工具:传…

作者头像 李华
网站建设 2026/4/20 5:44:45

YOLO在仓储物流中的应用:AGV导航依赖GPU加速YOLO

YOLO在仓储物流中的应用:AGV导航依赖GPU加速YOLO 在现代智能仓库里,你可能已经见过这样的场景:一排排自动导引车(AGV)沿着预定路径穿梭于货架之间,搬运托盘、避开行人、绕开临时障碍物——整个过程几乎无需…

作者头像 李华