用戶
 找回密碼
 立即注冊

QQ登錄

只需一步,快速開始

掃一掃,登錄網站

本帖最后由 是小桔啦 于 2020-6-12 15:05 編輯


你好,我是小桔,是一個沒有感情的代碼崽。


今天我想向你推薦一套全新的微信小程序組件庫:Lin UI,是兄弟就用它!


簡介


Lin UI是由林間有風團隊精心打造的一套微信小程序組件庫,組件豐富、設計優美,并且擁有完整的商業案例,是您開發微信小程序的不二選擇。





PS:這篇文章不會介紹 Lin UI 如何使用,我僅向你介紹它的優點,如果想要了解使用方法歡迎前往[文檔官網](http://doc.mini.talelin.com)查看**


特點


現在市面上已經有了許多組件庫:Vant Weapp、iView Weapp、Color UI、Wuss Weapp、Wux Weapp 等等等等,他們每一套也都能稱得上是成熟的組件庫。**那我為什么還要使用 Lin UI 呢?**


Lin UI 吸引我的地方主要有如下幾點:



  • 使用簡單
  • 設計好看
  • 組件豐富
  • 反饋及時


設計好看


Lin UI 的另一大特點就是視覺設計出眾,因為林間有風有專業的 UI 設計師對組件樣式進行設計,視覺方面甩其他樣式靠開發者自己設計的組件庫不止一條街。


文章開頭,我羅列了一堆組件,其中有一套,主打視覺,那就是 Color UI,也挺好看(Color UI 的作者也曾是一名設計師)。但是 Color 是一套 css 庫,并不是組件庫,至于具體區別,可以 Google 一下。


我們先來看幾個反面例子,這么”樸實無華“的樣式,你真的喜歡嗎



我們再來看一下 Lin Ui 是什么樣子



怎么樣,哪個好看應該不用我多說了吧


組件豐富


Lin UI 一共包含 54 個組件,不管你用于什么場景,基本都可以滿足你 90% 的需求,剩下的 10% ,可以通過提 Issue 的方式及時得到解決



使用簡單


開發過小程序的開發者可能都知道,小程序相比傳統 Web 來說,會簡單很多,因為我們不需要去處理多端設備上的屏幕兼容問題,這是小程序的一個優勢。但是,如果因為引入一套組件庫,讓你失去了開發簡單這項優勢,那還值得去使用它嗎?


Vant Weapp 是業內非常成熟的一套組件庫,它的開發也歷經了很長的周期。但是,在我看來,Vant Weapp 的一大缺點就是組件源碼非常復雜。這種復雜并不是說他的邏輯有多復雜,而是 Vant Weapp 對代碼做了大量的封裝,我們看一下下面的代碼:


[JavaScript] 純文本查看 復制代碼
import { VantComponent } from '../common/component';[/p][p=26, null, left]import { button } from '../mixins/button';
import { openType } from '../mixins/open-type';

VantComponent({
  mixins: [button, openType],

  data: {
    baseStyle: ''
  }
)}


這是 Vant Weapp 的 Button 組件部分源碼,我們知道,Button 組件幾乎是沒有業務邏輯的,但是它卻引入了 VantComponent、button、openType三個 ts 文件。



是不是一臉懵逼?VantComponent是啥?小程序原生的Component呢?button又是啥?openType又是什么鬼?甚至源碼還是用 TypeScript 寫的,我寫個小程序還得先去學一遍 TypeScript ?


如果你剛接觸小程序和 Vant Weapp,這種高度封裝的特性會導致一個非常嚴重的問題:當你在開發中遇到一個文檔解決不了的問題想翻看源碼時,你會發現你看不懂,你必須得理解其整套設計思想才能看懂其中每個組件的邏輯。很浪費時間對不對?


Lin UI 就完全不存在這個問題,只要你識字就能看懂源碼,不信你看


[JavaScript] 純文本查看 復制代碼
Component({[/p][p=26, null, left]  properties: {
    /**
     * 折疊面板類型
     */
    type: {
      type: String,
      value: 'normal'
    },
  },

  methods: {
    /**
     * 關閉所有打開的collapse-item
     */
    foldAllExpandItem(collapseItem) {
      for (let i = 0; i < this.data._expandItems.length; i++) {
        if (collapseItem !== this.data._expandItems[i]) {
          this.data._expandItems[i].foldContent();
        }
      }
      this.data._expandItems = [];
    }
});


這是 Lin UI IndexList 組件的源碼,因為篇幅問題,只截取了部分。為什么說只要識字就能看懂,因為我們對方法進行了詳細的注釋,并且沒有對微信原生 api 進行二次封裝,完全原生的寫法,保證你能看懂源碼,這么貼心,就問你感不感動!



總結:如果你非常熟悉小程序的各種 api 、熟悉 ts、并且在遇見 bug 時有耐心去理解高度封裝的設計思想,那么你可以使用 Vant Weapp。反之,如果你剛接觸小程序,或者不會 ts 、在遇見 bug 時想要以最快的速度解決 bug,那么 Lin UI 會給你最舒適的開發體驗。


反饋及時


一個開源項目,其活躍度是非常重要的。反饋的 Bug 能否得到及時的解決,有好的想法能否的項目作者接納并加入項目之中,以及使用這個項目的人數。這三點是在進行技術選型時必須要考慮的問題。


Lin UI 的反饋效率非常高,Issue 反饋的 Bug 平均能在 24 小時內得到解決,這已經是非常高的效率了。相比 Vant Weapp,因為其維護者都是在職開發者,所以時間并不會太充裕,Issue 處理速度肯定也會慢于 Lin UI 的。



結語


Lin UI 從 2019 年 4 月 24 日 發布第一個版本 0.1.0 以來,經過了一年多的迭代更新,600 多次 commit,300 多個 issue,換來的是現在已經足夠穩定且易用的 Lin UI 。如果喜歡,也歡迎到 Github上貢獻一顆 Star 。


我是小桔,歡迎關注我的微信公眾號,帶你了解更多前后端知識。


分享至 : QQ空間
0 人收藏
發新帖
您需要登錄后才可以回帖 登錄 | 立即注冊
快乐十分复式