前言：小程序已于11月初開放了小程序組件功能，但事件方面還不是很完善，有的組件暫時可能還是要用其他方式來實現(xiàn)，這里簡單記錄下開發(fā)小程序自定義組件的要點。

在小程序官方開發(fā)組件開發(fā)功能之前，自定義組件的數(shù)據(jù)和方法必須掛在頁面上，于是要點就在于將組件的私有數(shù)據(jù)和方法掛到頁面上，同時避免不同組件間，同一組件不同實例間，組件與頁面間的命名矛盾；其二，在組件內(nèi)修改其數(shù)據(jù)，在頁面上調(diào)用組件內(nèi)的方法，寫法上需稍留意。

實現(xiàn)方案：

• wepy: 小程序組件化開發(fā)框架

  • 支持自定義組件開發(fā)，其他特性可通讀一遍其文檔
  • 自定義組件的支持較完整
  • 屬于框架，開發(fā)上提供了多種便利，可使用sass/less，可引入npm包，可自定義組件等，但運行小程序所需文件由框架生成，開發(fā)調(diào)試上就多了一層，可見文檔[目錄結(jié)構(gòu)說明]和[重要提醒]
  • 使用此框架開發(fā)的人看起來也蠻多的，常用的UI/功能類組件有相應(yīng)的實現(xiàn)，有投入使用的項目，wepy在更新中，有微信交流群
  • 框架設(shè)計初衷是一份代碼可同時運行于小程序和web端，目前生成小程序版本是完善的，web版本目前可生成預(yù)覽版，看起來暫時還不能投入使用
  • 綜上，新開小程序項目考慮選用
  • 2017-12-01更新：wepy項目地址已遷移到 https://tencent.github.io/wepy/ （原來是：https://wepyjs.github.io/wepy/） ， 看到地址里的 tencent，以后做小程序果斷選用wepy框架

• wux: 微信小程序自定義組件

  • 在微信小程序官方開發(fā)方式基礎(chǔ)上
  • 關(guān)鍵文件component.js，給組件私有數(shù)據(jù)和方法加前綴$wux.[componnetname].[實例名]，可查看具體例子的AppData面板
  • 可只將需要的組件加入到自己項目中使用，也可基于此方法開發(fā)自己需要的組件
  • 基于此方式開發(fā)滾動評論組件的例子

• wx-component

  • 在微信小程序官方開發(fā)方式基礎(chǔ)上
  • 看其使用說明感覺實現(xiàn)方式是不錯的，不過我沒有測試或?qū)嶋H應(yīng)用過
• 微信小程序官方自定義組件

總結(jié)

以上是生活随笔為你收集整理的微信小程序自定义组件方案的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。