Cube-UI 最近做的更新
ofollow,noindex">Cube-UI 最近做了很多的更新，也有了很多的新特性，而且其中還包含了很多在移動端很常用的元件：
- Toolbar
- TabBar
- Checker
- ImagePreview
- Sticky
- ScrollNavBar
- ScrollNav
- RecycleList
模組：
- Locale 國際化
- create-api 分拆為獨立的 NPM 包vue-create-api
Toolbar
Toolbar 就是常用的工具欄，每個選項都可以有獨立的行為，此外，考慮到移動端寬度不夠的場景，還支援了更多模式，一些優先順序不夠的操作可以放到更多裡。
更多詳情，還請移步官方文件。
TabBar
TabBar 可以是獨立的一些 Tab 集合，響應當前選中的 Tab。當然，如果有更負責佈局需求，還可以支援插槽使用。
當然很多時候我們是需要和 TabBarPanels 結合在一起使用的，例如如下場景：
這樣就能實現上邊的 Tab 和下邊的 Panels 聯動的效果。
藉助於 TabBar 靈活的能力，還可以和 Slide、Scroll 一起組合使用，可以實現如下很常見的互動效果（橫向移動切換 Tab）：
當然，在電商的場景下，很容易出現 ScrollTab 的需求，只需要將 TabBar 和 Scroll 進行結合：
跟多細節，請移步官方文件。
Checker
Checker 是更加靈活的選擇元件，可以自定義需要的佈局樣式。
在自定義的選擇場景會比較有用，詳情移步官方文件。
ImagePreview
圖片預覽，常用的元件，支援雙指縮放，雙擊放大（縮小）圖片。
在特殊的場景下，你仍然可以選擇使用插槽滿足自己的業務需求：
詳情可以檢視官方文件。
Sticky
吸附元件是一個很強大的元件，不僅可以和 Scroll 元件結合使用，也可以和原生滾動效果做結合實現各種吸附效果，不僅僅可以實現單個的吸附，還可以實現連續多個的吸附，最基礎的吸附效果，就是類似於索引列表 IndexList 的效果。
當然，也有一些獨特的場景，例如微信朋友圈的效果，這個時候可能會涉及到“漸變”吸附的效果，在滾動過程中，樣式會隨著滾動而發生變化。
詳情可以在官方文件檢視。
ScrollNavBar
滾動導航條元件，這個效果和現有的滴滴乘客 WebApp 頂導的效果很像，當然還可以通過 Prop 改變方便為豎向的模式：
當選中了某一項，會自動計算滾動至居中位置，詳情移步官方文件。
ScrollNav
滾動導航元件，這個在外賣場景或者電商場景都是比較常用的，自動實現定位關聯的效果。這個元件本身是一個組合元件，利用上邊所說的 Sticky 和 ScrollNavBar 組合起來的元件。
還有一種是豎向的效果，更為常見：
感興趣的可以檢視官方文件。
RecycleList
可回收的滾動列表，在處理大量內容的列表的時候會很有用處，預設模式是無限滾動載入更多的模式：
當然，根據實際的場景，我們可能還會有另外一種模式，類無限滾動的模式，需要有墓碑元素存在來填充沒有資料的列表項，效果是這樣的：
更多詳細的，可以參考官方文件。
Locale
在最新的版本中，我們也支援了國際化的能力，內建了中文和英文的語言包，開發者可自定義使用自己的語言包。
除了預設的語言包能力之外，還參考了 Vue 本身的插值表示式和過濾器語法，用於實現特殊的需求，例如：日期格式化相關的。
舉個例子，預設中文語言包中關於 Validator 中相關資訊配置
{
validator: {
// ...
min: {
array: '請選擇至少 {{config}} 項',
date: '請選擇 {{config | toLocaleDateString("yyyy年MM月dd日")}} 之後的時間',
}
}
}
複製程式碼
create-api
這個在之前的文章中也有介紹，主要用於實現 API 式呼叫（例項化）元件的，而且提供了“單例”模式（在同一個呼叫上下文例項上）支援。
現在考慮到期通用能力，目前已經獨立為一個單獨的倉庫維護， vue-create-api ，詳細的使用方式可以直接參考 GitHub 上的 文件 。
展望
目前 Cube-UI 已經經歷了很多版本迭代，也隨著社群反饋，增加了很多的新的元件，回過頭來發現，我們其實有很多東西可以做的更好，所以近期我們會重新梳理總結，同時也會吸收、發掘、探索更多更好的方案，準備 2.0 版本，依舊提供一個質量可靠、體驗極致、標準規範和擴充套件性強的元件，但是會更強大、更易用、周邊生態會更好的版本。