自從17年11月份對外公布以來,KPC已經經過了8個月的迭代,期間發布了幾十個正式版本,但一直沒有到1.0,因為我們覺得1.0是個裡程碑版本,我們必須做的足夠完善才敢稱之為1.0。而如今我們有信心對外宣布:KPC 1.0終於來了!
其實距離0.0.1的發布,到現在已經1年多了,但是KPC並沒有收貨太多的關注,伴隨著一個接一個的小版本迭代,github上星星的數量也不緊不慢地突破100大關。但我們並沒有放棄對KPC的細心呵護,每一次star,每一個issue,都使我們備受鼓舞,促使我們打磨每一個細節,力爭做出自己的特色,做到精益求精。
關注KPC的用戶應該注意到了,KPC已經兩個月沒有發版了,是的,因為我們這段時間一直在專註1.0的開發,下面便說說這兩個月的工作成果吧。
1. 走馬燈(輪播圖)組件Carousel
除了支持最基本的走馬燈效果外,Carousel
還支持同時展示多個內容塊
2. 基於Monaco Editor的代碼編輯器組件Code
Monaco Editor是VSCode的web版,功能非常強大
3. 圖釘組件Affix
圖釘組件,用於在滾動頁面時,固定一些內容
4. 卡片組件Card
除了常用的卡片外,還支持分欄卡片
除了上述新增的組件外,對現有組件的功能也進行了大量優化和改進。
1. 表格組件Table
支持表頭分組,合併單元格,保存列寬信息等功能
2. 彈窗組件Dialog
支持靜態方法定義帶標題的樣式
3. 時間選擇組件Timepicker
支持步長設置時不展示秒鐘
4. 提示彈層組件Tooltip
,新增深色主題dark
,並且默認為深色
5. (級聯)選擇框組件Cascader/Select
新增無數據提示
6. 新增Vue/React
編譯包,減少配置項
之前需要配置webpack alias
才能是KPC在Vue/React
下使用,現在不需要,直接引用相應的組件即可,例如:
import Button from 'kpc/@vue/@css/components/button';
import Button from 'kpc/@react/@css/components/button';
當然你也可以設置alias
來簡化引用路徑
1.0中我們使用展示/隱藏(show/hide)
動畫來替代之前的創建/刪除(create/remove)
動畫,同時打磨動畫的細節,使動畫更自然流暢。
例如:之前的版本中,如果快速點擊,使一個展開的元素在收起和展開之間切換,則收起動畫會立即跳至最終狀態,然後再展開,這樣會顯得動畫很突兀
而1.0中,對於上述情況,它不會跳至最終狀態,而是從收起的中間狀態回到展開狀態,使動畫更自然
1.0中對部分文檔進行了補充,使之更易上手。同時對文檔中的示例代碼,可以在CodeSandbox中打開進行預覽和調試
Vue示例:https://codesandbox.io/embed/serverless-wood-n6ppy?fontsize=14
React示例:https://codesandbox.io/embed/practical-chatelet-3phlh?fontsize=14
沒有什麼東西是完美的,但應該保持追求完美的赤子之心。同樣,1.0也並非完美,還有大量工作亟待完成,它只是漫漫長征路上的第一個落腳點而已,至此,再出發,開啟新的篇章...
新增組件
Add
新增圖釘組件Affix
,用於滾動頁面固定某些內容 #300
Add
新增走馬燈(輪播圖)組件Carousel
#299
Add
新增代碼編輯器組件Code
,基於Monaco Editor
(VSCode)封裝而來 #288
Add
新增卡片組件Card
#241
新增特性
Add
新增全局配置方法configure
,使用configure({useWrapper: true})
可以開啟Dropdown/Tooltip
兼容模式 #291
Add
Tree
如果初始化數據中包含children
,當非同步載入時,不會再次調用loadData
函數去載入數據 #290
Add
Table
支持保存調整列寬后的列寬信息 #292
Add
Table
新增表頭分組功能 #265
Add
Table
新增合併單元格功能 #265
Add
Upload
支持文件類型強檢測,不合法是拋出error
事件,因為瀏覽器accept
屬性僅僅只是建議類型,並不能限制類型 #271
Add
Progress
新增warning
狀態 #301
Add
Tree
支持父子Checkbox
非關聯模式,該模式下父子的選中狀態單獨控制,互不影響 #302
Add
FormItem
新增fluid
屬性,展示100%
寬度的表單項 #303
Add
新增Vue/React
編譯包,減少webpack
alias
配置項 #308
Add
Button
組件新增secondary
和link
類型 #320
Add
Dialog
支持點擊遮罩層關閉彈窗 #324
Add
Dialog
靜態方法支持展示帶標題title
的彈窗 #324
Add
Select
和Cascader
在無內容時,展示「無內容」的提示層 #321
Add
Datepicker
和Timepicker
新增「確定」按鈕,以方便用戶關閉彈層 #322
Add
Timepicker
支持設置step
時,隱藏「分鐘」或/和「秒鐘」的展示 #323
Add
Tooltip
新增主題支持,默認展示為dark
主題 #326
Add
Transfer
新增list
header
擴展點,以及左右箭頭按鈕的控制,使之可以更靈活地定義穿梭框邏輯 #314
Add
當Table
fixHeader
設為true
時,表格高度自動設為100%
,然後根據父容器高度確定表格體的高度來展示滾動條 #310
組件優化
Refactor
優化Table
hover
以及滾動的性能 #310
Refactor
優化Slider
滾動條熱區,更容易點擊 #307
Refactor
優化彈出元素動畫,使用show/hide
動畫替代create/remove
動畫,使動畫更流暢 #278
Bug修復
Fix
修復錯誤地引入babel-types
導致可能不存在該模塊而編譯報錯的問題 #283
Fix
修復Pagination
當頁碼過長時溢出的問題 #286
Fix
修復Timepicker
範圍選擇時,首次彈出如果先選擇結束時間,時間取值不對的問題 #289
Fix
修復Table
調整列寬后,如果表格容器寬度變大,會出現表格寬度小於容器寬度的情況 #293
Fix
修復Slider
有Spinner
輸入框時,在設置了step
的情況下,輸入的過程中也會修正值,導致無法輸入想要的值的問題 #294
Fix
修復webpack
配置可能禁用了require.ensure
(如:新版Create React App)導致有些非同步載入的模塊報錯的問題 #304
Fix
修復Switch
點擊滑塊,由於click
事件被stopPropagation
而在外部監聽不到click
事件的問題 #309
Fix
修復Table
當表格高度固定時,data
改變導致出現滾動條,固定表頭和表格體沒對齊的問題 #310
Fix
修復默認主題下Message
icon顏色丟失的問題 #317
破壞性變更
Change
Drawer
由之前的點擊抽屜外任何區域關閉抽屜,改為點擊遮罩層才關閉Change
Datepicker
在選擇時間時,去掉無用的年月展示信息Change
使用es6 module
進行構建,例如代碼編譯優化 #297
文檔
Add
支持Vue/React
示例代碼,在CodeSandbox中打開 #267
Vue/React
開始文檔補充CDN用法
[admin
]