微信小程序代码逻辑复用(二)—— 解决方案

简介: 微信小程序代码逻辑复用(二)—— 解决方案

640.jpg

写在前面


从去年底到今年初,由于工作繁重以及一些私人的事情需要处理,耽误了公众号更新。这周开始恢复更新了。


之前的文章中,我也对微信小程序中的代码复用问题进行了阐述。历史文章在这里:

微信小程序页面代码复用探索(一)——  存在的问题及需求

文中提到的方案,其实在去年的时候,我已经实现了。本文将进行初步的介绍。


Zero


我给自己的解决方案取名为Zero。它是一个轻量级的,拥有命名空间的,基于Page层mixin的微信小程序代码逻辑复用方案。


Zero分为了两部分:Zero-loader 和 Zero.js。


Zero-loader负责转译wxml代码。在开发wxml时,可以将命名空间声明在模板上,Zero-loader会进行识别,并且将命名空间编译到模板的变量中。


Zero.js是一个运行时,对外暴露了三个接口:Base,Compose,Merge。Base确认页面主逻辑,Compose根据命名空间、组合多个mixin,Merge合并mixin和页面主逻辑。

整个Zero的示意图如下:

640.png


各个mixin之间进行了相互隔离,仅能通过页面主对象进行中转,解决传统mixin方案的命名冲突、隐式依赖的问题。


可以将页面公用的逻辑拆成公用mixin方便复用,也可以将页面业务分模块拆分为业务mixin,方便维护、迭代。


Zero实例


像开发Page一样开发Mixin,且不用担心命名冲突等问题,可以专注于页面代码逻辑拆分。以一个动态标题栏为例。动态标题栏会在多个页面使用,但是这里的逻辑却无法进行优雅的拆分。使用Zero后,可以将动态标题栏抽出作为一个mixin:

640.png


Zero特点


1、在Page层实现mixin,解决原生Component无法覆盖的代码复用场景。

2、各Mixin相互隔离,仅能通过Page中转,解决传统mixin方案的命名冲突、隐式依赖的问题,方便逻辑拆分。

3、原生方案,轻量级、渐进式,改造简单,接入方便。

Zero比较适合多人协作的,追求稳定,使用原生方法开发的复杂微信小程序。


写在后面


当初Zero的诞生,完全是为了解决业务开发中的痛点。如今,微信小程序已经官方支持Page层的mixin了。说明当初的思路是有可取的地方的。后续可能会对Zero进行开源,欢迎各位小伙伴多多交流了。


相关文章
|
2月前
|
小程序 JavaScript 前端开发
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
753 1
|
1月前
|
人工智能 小程序 搜索推荐
uni app下开发AI运动小程序解决方案
本文介绍了在小程序中实现AI运动识别的解决方案。该方案依托于UNI平台,通过高效便捷的插件形式,实现包括相机抽帧控制、人体识别、姿态识别等在内的多项功能,无需依赖后台服务器,大幅提高识别效率和用户体验。方案内置多种运动模式,支持自定义扩展,适用于AI健身、云上赛事、AI体测等多场景,适合新开发和存量改造项目。
适用于alist的微信遮罩代码
最近在研究alist网盘工具,终于找到了适用于alist的微信遮罩代码。代码如下:``` ```。下面是示例图片,可根据需要自行替换。![点击查看示例图片](https://ucc.alicdn.com/pic/developer-ecology/ms7h4bs4k7hme_1a36659fd3054e508107f6c764c6f0d3.jpg)
|
1月前
|
小程序 机器人 开发者
QQ 小程序已发布,但无法被搜索的解决方案
我的 QQ 小程序在 2024 年 8 月就已经审核通过,上架后却一直无法被搜索到。打开后,再在 QQ 上下拉查看 “最近使用”,发现他出现一下又马上消失。
46 2
|
2月前
|
缓存 小程序 索引
uni-app开发微信小程序时vant组件van-tabs的使用陷阱及解决方案
uni-app开发微信小程序时vant组件van-tabs的使用陷阱及解决方案
256 1
|
2月前
|
机器学习/深度学习 人工智能 JSON
微信小程序原生AI运动(动作)检测识别解决方案
近年来,疫情限制了人们的出行,却推动了“AI运动”概念的兴起。AI运动已在运动锻炼、体育教学、线上主题活动等多个场景中广泛应用,受到互联网用户的欢迎。通过AI技术,用户可以在家中进行有效锻炼,学校也能远程监督学生的体育活动,同时,云上健身活动形式多样,适合单位组织。该方案成本低、易于集成和扩展,已成功应用于微信小程序。
|
2月前
|
小程序 Java
小程序访问java后台失败解决方案
小程序访问java后台失败解决方案
54 2
|
2月前
|
JSON 小程序 前端开发
微信小程序-人脸核身解决方案
微信小程序-人脸核身解决方案
236 0
|
2月前
|
云安全 存储 小程序
PHP微信小程序解决方案PhpMall
PHP微信小程序解决方案PhpMall
45 0
|
2月前
|
JSON 小程序 JavaScript
uni-app开发微信小程序的报错[渲染层错误]排查及解决
uni-app开发微信小程序的报错[渲染层错误]排查及解决
706 7