Vant4 更新日志

2023-02-16 17:54 更新

提示

當前文檔為 Vant 4 的更新日志，其他版本請參考：

介紹

Vant 遵循 Semver 語義化版本規(guī)范。

發(fā)布節(jié)奏

  • 修訂號：每周發(fā)布，包含新特性和問題修復(fù)。
  • 次版本號：每隔一至二個月發(fā)布，包含新特性和較大的功能更新，向下兼容。
  • 主版本號：無固定的發(fā)布時間，包含不兼容更新和重大功能更新。

更新內(nèi)容

v4.0.2

?2022-12-03?

Bug Fixes

  • Field: 修復(fù)使用 formatter 時光標位置錯誤的問題 #11348
  • Image: 修復(fù)在 Nuxt 3 下圖片可能無法展示的問題 128972
  • NavBar: 修復(fù)屏幕旋轉(zhuǎn)時 placeholder 未自動適配高度的問題 #11351

v4.0.1

?2022-12-01?

Feature

  • Picker: 新增 selectedIndexes 作為事件入?yún)?nbsp;#11329

Bug Fixes

  • Field: 修復(fù)未選中時修改綁定的值會導(dǎo)致鍵盤彈出的問題 #11333

v4.0.0

?2022-11-26?

完整內(nèi)容請移步：「4.0 更新介紹」

Feature

  • List: 新增 disabled 屬性 #11307
  • BackTop: 支持動態(tài)設(shè)置 target 屬性 #11311
  • BackTop: 支持通過 CSS 變量修改組件位置 #11312
  • BackTop: 重命名 visibility-height 屬性為 offset #11309

Bug Fixes

  • Field: 修復(fù)格式化值后，光標位置錯誤的問題 #11308

v4.0.0-rc.9

?2022-11-24?

Bug Fixes

  • Cell: 修復(fù) arrow-direction 設(shè)置為 right 不顯示的問題 #11279
  • Style: 修復(fù) body 標簽上的 normalize 樣式未生效的問題 #11287

v4.0.0-rc.8

?2022-11-20?

Feature

  • 新增 BackTop 回到頂部組件，注意該新組件的 API 尚未穩(wěn)定，在 4.0 正式版發(fā)布前仍可能產(chǎn)生 breaking change #11236

Bug Fixes

  • DropdownItem: 修復(fù)使用 teleport 時無法設(shè)置 attr 的問題 #11273
  • List: 修復(fù)初始的 loading 值為 true 時加載錯誤的問題 #11275
  • NumberKeyboard: 修復(fù)使用 teleport 時無法設(shè)置 attr 的問題 #11274

v4.0.0-rc.7

?2022-11-13?

New Component

  • 新增 SkeletonAvatar、SkeletonTitle、SkeletonImage、SkeletonParagraph 組件 #11173

Feature

  • ImagePreview: 新增 long-press 事件 #11252
  • Popover: 支持非受控模式 #11244

Bug Fixes

  • ActionSheet: 修復(fù)標題為空時取消按鈕層級錯誤的問題 #11213
  • DatePicker: 在生產(chǎn)環(huán)境下不再拋出開發(fā)錯誤提示 #11248
  • Lazyload: 修復(fù)使用 lazy-image 時報錯 h is not a function 的問題 #11229
  • Picker: 修復(fù)拋出 confirm 事件時 v-model 未正確更新的問題 #11194
  • Picker: 修復(fù) column 為空時操作報錯的問題 #11249
  • Uploader: 修復(fù) show-upload 為 false 時 chooseFile 無法調(diào)用的問題 #11218

v4.0.0-rc.6

?2022-10-23?

Feature

  • Calendar: subtitle 插槽新增 text 和 date 入?yún)?nbsp;#11168
  • Cell: 新增 tag 屬性 #11139
  • ImagePreview: 新增 image 插槽 #11133
  • Toast: 新增 wordBreak 選項 #11147

Bug Fixes

  • CouponList: 修復(fù) coupon 位置錯誤的問題 #11153
  • CouponList: 修復(fù)輸入框樣式錯誤的問題 #11155
  • Swipe: 修復(fù)在 Popup 內(nèi)時個別情況下渲染錯誤的問題 #11162

v4.0.0-rc.5

?2022-10-07?

Feature

  • Field: 支持將 label-position 設(shè)置為 top #11102
  • Loading: 新增 icon 插槽 #11109
  • NavBar: 新增 clickable 屬性 #11048
  • Stepper: 新增 auto-fixed 屬性 #11071

Bug Fixes

  • DatePicker: 修復(fù)日期超出 maxDate 時格式化不正確的問題 #11122
  • Tabs: 修復(fù)開啟 scrollspy 時個別情況下標題欄滾動位置錯誤的問題 #11116
  • Tabs: 修復(fù)開啟 scrollspy 時 nav-bottom 插槽遮擋內(nèi)容的問題 #11115

v4.0.0-rc.4

?2022-09-25?

Feature

  • Field: end-validate 事件新增 message 參數(shù) #11080

Bug Fixes

  • Tabs: 修復(fù)個別情況下頁面滾動位置錯誤的問題 #11085
  • Tabs: 修復(fù)初始化時菜單橫向滾動位置錯誤的問題 #11059

v4.0.0-rc.3

?2022-09-12?

Feature

  • ConfigProvider: 新增 ConfigProviderThemeVars 類型 #11034
  • Notify: 新增 z-index 屬性 #11032
  • 移除 ?@popperjs/core? 依賴，減少安裝體積 1.6MB #11030

Types

  • Toast: 修復(fù)缺少全局類型定義的問題 #11033

v4.0.0-rc.2

?2022-09-11?

Breaking Changes

  • 調(diào)整了所有 CSS 變量的掛載位置，由 ?body? 節(jié)點調(diào)整回 ?:root? 節(jié)點，調(diào)整后與 Vant v3 版本保持一致，以便于 v3 項目更平滑地升級到 v4 版本。 #11026

Bug Fixes

  • Dialog: 修復(fù)過渡動畫異常的問題 #11028
  • Empty: 修復(fù)深色模式下亮度過高的問題 #11027

v4.0.0-rc.1

?2022-09-10?

Feature

  • 導(dǎo)出所有組件的 props，方便進行二次封裝 #11024
  • Dialog: message-align 屬性支持設(shè)置為 justify #11014
  • Image: 新增 block 屬性 #11022
  • Toast: 新增 message 插槽 #11018

Bug Fixes

  • Picker: 修復(fù)部分情況下未正確更新選中值的問題 #11009
  • Locale: 修復(fù)讀取 i18n 文案時可能獲取到 JS 原生方法的問題 #11010

v4.0.0-rc.0

?2022-09-04?

Feature

Bug Fixes

  • DatePicker: 修復(fù)未正確更新 modelValue 的問題 #10984
  • DatePicker: 修復(fù) min-date 屬性未正確生效的問題 #10985

v4.0.0-beta.1

?2022-08-24?

Breaking Changes

  • Popup: 默認添加了 ?box-sizing: border-box? 樣式。
  • Popup: 調(diào)整了 ?position="center"? 時的水平居中方式，以解決彈窗寬度無法正確自適應(yīng)的問題。
// Vant 3
.van-popup--center {
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
}

// Vant 4
.van-popup--center {
  left: 0;
  right: 0;
  width: fit-content;
  max-width: calc(100vw - var(--van-padding-md) * 2);
  margin: 0 auto;
  transform: translateY(-50%);
}

New Component

Feature

  • ConfigProvider: 新增 z-index 屬性，用于設(shè)置彈窗組件的 z-index #10915
  • Form: 新增 rule 的 validateEmpty 選項 #10913
  • Popup: 新增 role 和 tabindex，優(yōu)化無障礙訪問 #10894
  • TouchEmulator: 支持 .mjs 后綴 #10888

Feature

  • ConfigProvider: 新增 theme-vars-dark 和 theme-vars-light 屬性 #10939
  • Picker: 新增 clickOption 事件 #10865
  • 為 scroll 事件添加了正確的 passive 標記來提升滾動性能 #10951
  • @vant/use: 優(yōu)化 useEventListener 類型定義 #10952

Bug Fixes

  • ConfigProvider: 修復(fù)銷毀時沒有回收全局樣式類的問題 #10898
  • 修復(fù) touchstart 導(dǎo)致控制臺出現(xiàn) passive event warning 的問題 #10954
  • Tabs: 修復(fù)開啟 swipeable 時，resize 方法無法正確生效的問題 #10964
  • 修復(fù)在 WebStorm 下標簽無法自動補全的問題 #10946
  • Badge: 修復(fù)使用 show-zero 時字符串 '0' 不生效的問題 #10921
  • Calendar: 修復(fù)關(guān)閉彈窗過程中內(nèi)容白屏的問題 #10910
  • Calendar: 修復(fù)控制臺出現(xiàn)讀取 getFullYear 異常的問題 #10909
  • Empty: 修復(fù)在 Tab 下嵌套使用時渲染異常的問題 #10943
  • Popover: 修復(fù)在 Popup 下嵌套使用時無法滾動的問題 #10949
  • PullRefresh: 修復(fù) Chrome 控制臺出現(xiàn) passive event warning 的問題 #10938
  • Search: 修復(fù) --van-search-input-height 樣式變量不生效的問題 #10911

v4.0.0-beta.0

?2022-07-16?

Breaking Changes

  • Toast: 重新設(shè)計函數(shù)調(diào)用 API #10804
  • Dialog: 重新設(shè)計函數(shù)調(diào)用 API #10781
  • Notify: 重新設(shè)計函數(shù)調(diào)用 API#10782
  • ImagePreview: 重新設(shè)計函數(shù)調(diào)用 API #10802

關(guān)于以上改動的詳細描述和遷移方法，請參考 從 v3 升級到 v4 的 「API 調(diào)整」部分。

Feature

  • 新增 @vant/compat 包，用于輔助代碼遷移 #10806
  • Calendar: 新增 getSelectedDate 方法 419a8e
  • 由于主題定制方式調(diào)整，發(fā)布到 npm 的代碼中將不再包含 .less 樣式源文件，從而減少 npm 包體積 #10752

Bug Fixes

  • Uploader: 修復(fù)預(yù)覽圖片時會展示上傳失敗的圖片的問題 #10790

v4.0.0-alpha.4

?2022-05-31?

Feature

  • 適配 nuxt 3，現(xiàn)在 dist 目錄下所有 esmodule 文件將使用 ?.mjs? 文件后綴 #10625

v4.0.0-alpha.3

?2022-05-02?

Feature

  • Form: 支持同時設(shè)置多個 validate-trigger 值 #10544
  • Empty: 支持在無網(wǎng)絡(luò)的環(huán)境下離線使用，圖片從 CDN 調(diào)整為內(nèi)聯(lián)的 SVG 圖片 #10514 #10515 #10516
  • Loading: 優(yōu)化無障礙訪問 #10568

Bug Fixes

  • Search: 修復(fù)暗色模式下樣式錯誤的問題 #10527
  • @vant/area-data: 修復(fù)發(fā)布到 npm 時包含 tsconfig.json 文件導(dǎo)致編譯錯誤的問題 f927f6

v4.0.0-alpha.2

?2022-04-16?

Feature

  • CalendarDay: 增加日期行間距 #10441
  • Empty: 支持單獨設(shè)置 image 的寬高 #10465
  • Field: 新增 enterkeyhint 屬性 #10478
  • Form: 新增 getValues 方法 #10511
  • Icon: 新增 qq、weibo 等圖標 #10468
  • Locale: 新增 Danish 丹麥語 #10513
  • ShareSheet: 不再依賴 CDN 上的圖片資源，使用 iconfont 代替 #10469
  • web-types.json 文件增加 event arguments 信息 #10474

Bug Fixes

  • DatetimePicker: 修復(fù) modeValue 與選中的數(shù)據(jù)不一致的問題 #10448
  • Rate: 修復(fù)多行時滑動選中不正確的問題 #10500

v4.0.0-alpha.1

?2022-03-19?

Feature

  • @vant/area-data: 新增南京市江北新區(qū) #10410
  • Locale: 新增老撾語 #10388

Bug Fixes

  • Calendar: 修復(fù)暗色模式下標題顏色 #10403
  • Picker: 修復(fù)暗色模式下標題顏色 #10403
  • ConfigProvider: 修復(fù)默認設(shè)置暗色模式不生效的問題 #10413
  • DatePicker: 修復(fù)更新 v-model 不生效的問題 #10415
  • Dialog: 修復(fù)暗色模式下標題和文本顏色 #10379
  • IndexBar: 修復(fù)底部索引無法高亮的問題 #10404

4.0.0-alpha.0

?2022-02-21?

不兼容更新

參見 從 v3 升級到 v4。

Feature

  • ConfigProvider: 新增 ?theme? 屬性，用于開啟深色模式
  • ConfigProvider: 新增 ?ConfigProviderTheme? 類型

Style

在之前的版本中，Vant 組件有兩種色彩風(fēng)格，一部分采用紅色作為主色調(diào)，另一部分采用藍色。為了保持色彩規(guī)范的統(tǒng)一，我們在 Vant 4 中對組件的主色調(diào)進行了統(tǒng)一，所有組件均采用藍色作為主色調(diào)。

以下組件的默認色值風(fēng)格由紅色調(diào)整為藍色：

  • AddressEdit
  • AddressList
  • Card
  • Calendar
  • Cascader
  • ContactList
  • ContactEdit
  • CouponList
  • Dialog
  • DropdownMenu
  • IndexBar
  • Sidebar
  • Steps
  • Tabs
  • TreeSelect

其他：

  • ?--van-font-bold? 的默認值由 ?500? 調(diào)整為 ?600?
  • ActionBar: 調(diào)整 ?--van-action-bar-icon-text-color? 變量的默認值為 ?--van-text-color?
  • AddressList: 重命名 ?--van-address-list-item-radio-icon-color? 為 ?--van-address-list-radio-color?
  • Button: 默認圓角大小從 ?2px? 調(diào)整為 ?4px?
  • Button: 默認按鈕的邊框顏色調(diào)整為 ?--van-gray-4?
  • Button: 調(diào)整 ?font-smoothing?，默認使用粗體文字
  • Cell: 只設(shè)置 ?value? 時，內(nèi)容不再會靠左對齊
  • Card: 調(diào)整 ?--van-card-background? 變量的默認值為 ?--van-background?
  • Card: 調(diào)整 ?--van-card-price-color? 變量的默認值為 ?--van-text-color?
  • Card: 調(diào)整 ?--van-card-desc-color? 變量的默認值為 ?--van-text-color-2?
  • ContactList: 重命名 ?--van-contact-list-item-radio-icon-color? 為 ?--van-contact-list-radio-color?
  • CouponList: 重命名 ?--van-coupon-corner-checkbox-icon-color? 為 ?--van-coupon-checkbox-color?
  • Field: 調(diào)整 ?--van-field-label-color? 變量的默認值為 ?--van-text-color?
  • Switch: 移除 ?--van-switch-border? 變量
  • Switch: 調(diào)整 ?--van-switch-size? 變量的默認值為 ?26px?
  • Switch: 調(diào)整 ?--van-switch-background? 變量的默認值為 ?rgba(120, 120, 128, 0.16)?
  • Tabbar: 調(diào)整 ?--van-tabbar-item-text-color? 變量的默認值為 ?--van-text-color?
  • GridItem: 調(diào)整 ?--van-grid-item-text-color? 變量的默認值為 ?--van-text-color?


以上內(nèi)容是否對您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號
微信公眾號

編程獅公眾號