寫在前面

從去年底到今年初，由于工作繁重以及一些私人的事情需要處理，耽誤了公眾號更新。這周開始恢復(fù)更新了。

之前的文章中，我也對微信小程序中的代碼復(fù)用問題進行了闡述。歷史文章在這里：

微信小程序頁面代碼復(fù)用探索（一）——  存在的問題及需求

文中提到的方案，其實在去年的時候，我已經(jīng)實現(xiàn)了。本文將進行初步的介紹。

Zero

我給自己的解決方案取名為Zero。它是一個輕量級的，擁有命名空間的，基于Page層mixin的微信小程序代碼邏輯復(fù)用方案。

Zero分為了兩部分：Zero-loader 和 Zero.js。

Zero-loader負(fù)責(zé)轉(zhuǎn)譯wxml代碼。在開發(fā)wxml時，可以將命名空間聲明在模板上，Zero-loader會進行識別，并且將命名空間編譯到模板的變量中。

Zero.js是一個運行時，對外暴露了三個接口：Base，Compose，Merge。Base確認(rèn)頁面主邏輯，Compose根據(jù)命名空間、組合多個mixin，Merge合并mixin和頁面主邏輯。

整個Zero的示意圖如下：

各個mixin之間進行了相互隔離，僅能通過頁面主對象進行中轉(zhuǎn)，解決傳統(tǒng)mixin方案的命名沖突、隱式依賴的問題。

可以將頁面公用的邏輯拆成公用mixin方便復(fù)用，也可以將頁面業(yè)務(wù)分模塊拆分為業(yè)務(wù)mixin，方便維護、迭代。

Zero實例

像開發(fā)Page一樣開發(fā)Mixin，且不用擔(dān)心命名沖突等問題，可以專注于頁面代碼邏輯拆分。以一個動態(tài)標(biāo)題欄為例。動態(tài)標(biāo)題欄會在多個頁面使用，但是這里的邏輯卻無法進行優(yōu)雅的拆分。使用Zero后，可以將動態(tài)標(biāo)題欄抽出作為一個mixin：

Zero特點

1、在Page層實現(xiàn)mixin，解決原生Component無法覆蓋的代碼復(fù)用場景。

2、各Mixin相互隔離，僅能通過Page中轉(zhuǎn)，解決傳統(tǒng)mixin方案的命名沖突、隱式依賴的問題，方便邏輯拆分。

3、原生方案，輕量級、漸進式，改造簡單，接入方便。

Zero比較適合多人協(xié)作的，追求穩(wěn)定，使用原生方法開發(fā)的復(fù)雜微信小程序。

寫在后面

當(dāng)初Zero的誕生，完全是為了解決業(yè)務(wù)開發(fā)中的痛點。如今，微信小程序已經(jīng)官方支持Page層的mixin了。說明當(dāng)初的思路是有可取的地方的。后續(xù)可能會對Zero進行開源，歡迎各位小伙伴多多交流了。