blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

Merge branch 'dev' into next

Browse Source
This commit is contained in:
chenjiahan 2020-08-07 06:33:04 +08:00
commit 17c64b24e7
84 changed files with 898 additions and 345 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

82
docs/markdown/changelog.en-US.md
View File

@ -10,6 +10,74 @@ Vant follows [Semantic Versioning 2.0.0](https://semver.org/lang/zh-CN/).
- Minor version：released every one to two months, including backwards compatible features. - Minor version：released every one to two months, including backwards compatible features.
- Major version：including breaking changes and new features. - Major version：including breaking changes and new features.
### [v2.10.0-beta.5](https://github.com/youzan/vant/compare/v2.10.0-beta.4...v2.10.0-beta.5)
`2020-08-06`
**style**
- NumberKeyboard: adjust padding bottom [#6938](https://github.com/youzan/vant/issues/6938)
**Bug Fixes**
- AddressEdit: render error in some cases [#6942](https://github.com/youzan/vant/issues/6942)
- Dialog: incorrect padding with round-button theme [#6936](https://github.com/youzan/vant/issues/6936)
- Info: number vertical align center [#6952](https://github.com/youzan/vant/issues/6952)
- NumberKeyboard: incorrect key height on legacy safari [#6937](https://github.com/youzan/vant/issues/6937)
- Picker: When item.defaultIndex is 0, this.defaultIndex will be used [#6948](https://github.com/youzan/vant/issues/6948)
- Sku: header image shrink [#6949](https://github.com/youzan/vant/issues/6949)
### [v2.10.0-beta.4](https://github.com/youzan/vant/compare/v2.10.0-beta.3...v2.10.0-beta.4)
`2020-08-04`
- Revert "fix(Icon): incorrect image icon height when loading (#6858)" [#6858](https://github.com/youzan/vant/issues/6858)
### [v2.10.0-beta.3](https://github.com/youzan/vant/compare/v2.10.0-beta.2...v2.10.0-beta.3)
`2020-08-04`
**style**
- Dialog: fix round-button theme [#6934](https://github.com/youzan/vant/issues/6934)
### [v2.10.0-beta.2](https://github.com/youzan/vant/compare/v2.10.0-beta.1...v2.10.0-beta.2)
`2020-08-03`
**Feature**
- Dialog: add new prop theme [#6921](https://github.com/youzan/vant/issues/6921)
- Icon: add back-top icon [#6931](https://github.com/youzan/vant/issues/6931)
**style**
- Image: adjust icon color to @gray-4 [729cca](https://github.com/youzan/vant/commit/729cca61a978ba243cf442143ae85d2abb464de0)
- Tab: disable ellipsis when scrollable [bc0e45](https://github.com/youzan/vant/commit/bc0e45687a76f49355efa7fb2403184746575012)
**Bug Fixes**
- Calendar: should only scroll calendar body when inited [#6926](https://github.com/youzan/vant/issues/6926)
### [v2.10.0-beta.1](https://github.com/youzan/vant/compare/v2.9.4...v2.10.0-beta.1)
`2020-07-31`
**Feature**
- Icon: add photo-fail icon [#6883](https://github.com/youzan/vant/issues/6883)
- DropdownMenu: add @dropdown-menu-box-shadow var [6d0c54](https://github.com/youzan/vant/commit/6d0c54e8f4e9c1c9982778df8a36c7ac3fc2f905)
**style**
- CouponCell: insert a space after currency [#6888](https://github.com/youzan/vant/issues/6888)
- Image: update loading icon and error icon [#6890](https://github.com/youzan/vant/issues/6890)
- NumberKeyboard: adjust key height to 28px [#6899](https://github.com/youzan/vant/issues/6899)
- Sku: improve price align [#6911](https://github.com/youzan/vant/issues/6911)
- Tab: remove default border [69ac60](https://github.com/youzan/vant/commit/69ac602bc21b445fb88783303d00bd65e4dc5ae2)
- Tab: adjust padding in complete mode [90e678](https://github.com/youzan/vant/commit/90e678756aecddee2beb522e38017c68f616b387)
- Tab: update nav padding [8027f4](https://github.com/youzan/vant/commit/8027f46f3ff33b200cf022e5f9a2693293a1bb16)
### [v2.10.0-beta.0](https://github.com/youzan/vant/compare/v2.9.4-beta.0...v2.10.0-beta.0) ### [v2.10.0-beta.0](https://github.com/youzan/vant/compare/v2.9.4-beta.0...v2.10.0-beta.0)
`2020-07-25` `2020-07-25`
@ -44,6 +112,20 @@ Vant follows [Semantic Versioning 2.0.0](https://semver.org/lang/zh-CN/).
- Icon: incorrect image icon height when loading [#6858](https://github.com/youzan/vant/issues/6858) - Icon: incorrect image icon height when loading [#6858](https://github.com/youzan/vant/issues/6858)
- ImagePreview: fit orientationchange [#6825](https://github.com/youzan/vant/issues/6825) - ImagePreview: fit orientationchange [#6825](https://github.com/youzan/vant/issues/6825)
### [v2.9.4](https://github.com/youzan/vant/compare/v2.9.3...v2.9.4)
`2020-07-29`
**Feature**
- ShareSheet: add className option [#6886](https://github.com/youzan/vant/issues/6886)
- Sku: modify default min year of sku date picker [#6879](https://github.com/youzan/vant/issues/6879)
**Bug Fixes**
- Popup: incorrect lock scroll in some cases [#6892](https://github.com/youzan/vant/issues/6892)
- Stepper: double tap to scroll in safari [#6882](https://github.com/youzan/vant/issues/6882)
### [v2.9.3](https://github.com/youzan/vant/compare/v2.9.2...v2.9.3) ### [v2.9.3](https://github.com/youzan/vant/compare/v2.9.2...v2.9.3)
`2020-07-19` `2020-07-19`

82
docs/markdown/changelog.zh-CN.md
View File

@ -10,6 +10,74 @@ Vant 遵循 [Semver](https://semver.org/lang/zh-CN/) 语义化版本规范。
- 次版本号：每隔一至二个月发布，包含新特性和较大的功能更新，向下兼容。 - 次版本号：每隔一至二个月发布，包含新特性和较大的功能更新，向下兼容。
- 主版本号：发布时间不定，包含不兼容更新，预计下一个主版本会与 Vue 3.0 同期发布。 - 主版本号：发布时间不定，包含不兼容更新，预计下一个主版本会与 Vue 3.0 同期发布。
### [v2.10.0-beta.5](https://github.com/youzan/vant/compare/v2.10.0-beta.4...v2.10.0-beta.5)
`2020-08-06`
**style**
- NumberKeyboard: 减少底部留白大小 [#6938](https://github.com/youzan/vant/issues/6938)
- Dialog: 优化使用 round-button 主题时的内边距 [#6936](https://github.com/youzan/vant/issues/6936)
**Bug Fixes**
- AddressEdit: 修复个别情况下按钮渲染错误的问题 [#6942](https://github.com/youzan/vant/issues/6942)
- Info: 修复 badge 的数字在 iOS 上不居中的问题 [#6952](https://github.com/youzan/vant/issues/6952)
- NumberKeyboard: 修复在低版本 safari 上按键高度错误的问题 [#6937](https://github.com/youzan/vant/issues/6937)
- Picker: 修复 defaultIndex 在个别情况下取值逻辑错误的问题 [#6948](https://github.com/youzan/vant/issues/6948)
- Sku: 修复价格较长时顶部图片的宽度被压缩的问题 [#6949](https://github.com/youzan/vant/issues/6949)
### [v2.10.0-beta.4](https://github.com/youzan/vant/compare/v2.10.0-beta.3...v2.10.0-beta.4)
`2020-08-04`
- 回滚 "fix(Icon): 修复图片图标加载过程中高度异常的问题 (#6858)" [#6858](https://github.com/youzan/vant/issues/6858)
### [v2.10.0-beta.3](https://github.com/youzan/vant/compare/v2.10.0-beta.2...v2.10.0-beta.3)
`2020-08-04`
**style**
- Dialog: 修复 round-theme 弹窗样式错误的问题 [#6934](https://github.com/youzan/vant/issues/6934)
### [v2.10.0-beta.2](https://github.com/youzan/vant/compare/v2.10.0-beta.1...v2.10.0-beta.2)
`2020-08-03`
**Feature**
- Dialog: 新增 theme 属性，用于展示圆角按钮风格的弹窗 [#6921](https://github.com/youzan/vant/issues/6921)
- Icon: 新增 back-top 图标 [#6931](https://github.com/youzan/vant/issues/6931)
**style**
- Dialog: 确认按钮的默认颜色调整为红色 [#6921](https://github.com/youzan/vant/issues/6921)
- Image: 加载图标和错误图标的颜色调整为 @gray-4 [729cca](https://github.com/youzan/vant/commit/729cca61a978ba243cf442143ae85d2abb464de0)
- Tab: 在横向滚动模式下默认不截断标题的文字 [bc0e45](https://github.com/youzan/vant/commit/bc0e45687a76f49355efa7fb2403184746575012)
**Bug Fixes**
- Calendar: 修复初始化日历时页面滚动条位置错误的问题 [#6926](https://github.com/youzan/vant/issues/6926)
### [v2.10.0-beta.1](https://github.com/youzan/vant/compare/v2.9.4...v2.10.0-beta.1)
`2020-07-31`
**Feature**
- Icon: 新增 photo-fail 图标 [#6883](https://github.com/youzan/vant/issues/6883)
- DropdownMenu: 新增 @dropdown-menu-box-shadow 变量 [6d0c54](https://github.com/youzan/vant/commit/6d0c54e8f4e9c1c9982778df8a36c7ac3fc2f905)
**style**
- Tab: 移除默认边框 [69ac60](https://github.com/youzan/vant/commit/69ac602bc21b445fb88783303d00bd65e4dc5ae2)
- Tab: 优化标签间距 [90e678](https://github.com/youzan/vant/commit/90e678756aecddee2beb522e38017c68f616b387) [8027f4](https://github.com/youzan/vant/commit/8027f46f3ff33b200cf022e5f9a2693293a1bb16)
- Image: 更新加载图标和错误图标 [#6890](https://github.com/youzan/vant/issues/6890)
- CouponCell: 优化金额与符号的间隔 [#6888](https://github.com/youzan/vant/issues/6888)
- Sku: 优化价格符号位置，与下方文案对齐 [#6911](https://github.com/youzan/vant/issues/6911)
- NumberKeyboard: 调整按键高度为 28px，增加底部空白区域 [#6899](https://github.com/youzan/vant/issues/6899)
### [v2.10.0-beta.0](https://github.com/youzan/vant/compare/v2.9.4-beta.0...v2.10.0-beta.0) ### [v2.10.0-beta.0](https://github.com/youzan/vant/compare/v2.9.4-beta.0...v2.10.0-beta.0)
`2020-07-25` `2020-07-25`
@ -44,6 +112,20 @@ Vant 遵循 [Semver](https://semver.org/lang/zh-CN/) 语义化版本规范。
- Icon: 修复图片图标加载过程中高度异常的问题 [#6858](https://github.com/youzan/vant/issues/6858) - Icon: 修复图片图标加载过程中高度异常的问题 [#6858](https://github.com/youzan/vant/issues/6858)
- ImagePreview: 修复 iOS 下旋转屏幕时布局错误的问题 [#6825](https://github.com/youzan/vant/issues/6825) - ImagePreview: 修复 iOS 下旋转屏幕时布局错误的问题 [#6825](https://github.com/youzan/vant/issues/6825)
### [v2.9.4](https://github.com/youzan/vant/compare/v2.9.3...v2.9.4)
`2020-07-29`
**Feature**
- ShareSheet: 新增 className 选项，用于自定义选项的类名 [#6886](https://github.com/youzan/vant/issues/6886)
- Sku: 优化日期选择范围 [#6879](https://github.com/youzan/vant/issues/6879)
**Bug Fixes**
- Popup: 修复在个别情况下滚动锁定无法解除的问题 [#6892](https://github.com/youzan/vant/issues/6892)
- Stepper: 修复在 safari 上快速点击按钮时会导致页面滚动的问题 [#6882](https://github.com/youzan/vant/issues/6882)
### [v2.9.3](https://github.com/youzan/vant/compare/v2.9.2...v2.9.3) ### [v2.9.3](https://github.com/youzan/vant/compare/v2.9.2...v2.9.3)
`2020-07-19` `2020-07-19`

4
package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "vant", "name": "vant",
"version": "2.10.0-beta.0", "version": "2.10.0-beta.5",
"description": "Mobile UI Components built on Vue", "description": "Mobile UI Components built on Vue",
"main": "lib/index.js", "main": "lib/index.js",
"module": "es/index.js", "module": "es/index.js",
@ -51,7 +51,7 @@
"license": "MIT", "license": "MIT",
"dependencies": { "dependencies": {
"@babel/runtime": "7.x", "@babel/runtime": "7.x",
"@vant/icons": "1.2.3", "@vant/icons": "1.2.5",
"vue-lazyload": "1.2.3" "vue-lazyload": "1.2.3"
}, },
"peerDependencies": { "peerDependencies": {

12
packages/vant-cli/yarn.lock
View File

@ -2918,9 +2918,9 @@ bluebird@^3.1.1, bluebird@^3.5.5:
integrity sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg== integrity sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==
bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.1.1, bn.js@^4.4.0: bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.1.1, bn.js@^4.4.0:
version "4.11.8" version "4.11.9"
resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.11.8.tgz#2cde09eb5ee341f484746bb0309b3253b1b1442f" resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.11.9.tgz#26d556829458f9d1e81fc48952493d0ba3507828"
integrity sha512-ItfYfPLkWHUjckQCk8xC+LwxgK8NYcXywGigJgSwOP8Y2iyWT4f2vsZnoOXTTbo+o5yXmIUJ4gn5538SO5S3gA== integrity sha512-E6QoYqCKZfgatHTdHzs1RRKP7ip4vvm+EyRUeE2RF0NblwVvb0p6jSVeNTOFxPn26QXN2o6SMfNxKp6kU8zQaw==
body-parser@1.19.0: body-parser@1.19.0:
version "1.19.0" version "1.19.0"
@ -4617,9 +4617,9 @@ elegant-spinner@^2.0.0:
integrity sha1-8jY3iYXs0W2nVIjRZr5LaI/Vr5Q= integrity sha1-8jY3iYXs0W2nVIjRZr5LaI/Vr5Q=
elliptic@^6.0.0: elliptic@^6.0.0:
version "6.5.2" version "6.5.3"
resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.2.tgz#05c5678d7173c049d8ca433552224a495d0e3762" resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.3.tgz#cb59eb2efdaf73a0bd78ccd7015a62ad6e0f93d6"
integrity sha512-f4x70okzZbIQl/NSRLkI/+tteV/9WqL98zx+SQ69KbXxmVrmjwsNUPn/gYJJ0sHvEak24cZgHIPegRePAtA/xw== integrity sha512-IMqzv5wNQf+E6aHeIqATs0tOLeOTwj1QKbRcS3jBbYkl5oLAserA8yJTT7/VyHUYG91PRmPyeQDObKLPpeS4dw==
dependencies: dependencies:
bn.js "^4.4.0" bn.js "^4.4.0"
brorand "^1.0.1" brorand "^1.0.1"

8
packages/vant-icons/CHANGELOG.md
View File

@ -1,5 +1,13 @@
## Changelog ## Changelog
## 1.2.5
- add back-top icon
## 1.2.4
- add photo-fail icon
## 1.2.3 ## 1.2.3
- fix enlarge icon align - fix enlarge icon align

BIN
packages/vant-icons/assets/icons.sketch
View File

Binary file not shown.

2
packages/vant-icons/build/codepoints.js
View File

@ -229,6 +229,8 @@ const map = {
F0E2: 'wechat', F0E2: 'wechat',
F0E3: 'youzan-shield', F0E3: 'youzan-shield',
F0E4: 'enlarge', F0E4: 'enlarge',
F0E5: 'photo-fail',
F0E6: 'back-top',
}; };
const reversedMap = {}; const reversedMap = {};

4
packages/vant-icons/build/template.tpl
View File

@ -13,7 +13,7 @@
.van-icon { .van-icon {
position: relative; position: relative;
display: inline-block; display: inline-block;
font: normal normal normal 14px/1 "<%= fontName %>"; font: normal normal normal 14px/1 '<%= fontName %>';
font-size: inherit; font-size: inherit;
text-rendering: auto; text-rendering: auto;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
@ -24,7 +24,7 @@
} }
<% _.each(glyphs, function(glyph) { %>.van-icon-<%= glyph.fileName %>::before { <% _.each(glyphs, function(glyph) { %>.van-icon-<%= glyph.fileName %>::before {
content: "\<%= glyph.codePoint %>"; content: '\<%= glyph.codePoint %>';
} }
<% }); %> <% }); %>

2
packages/vant-icons/package.json
View File

@ -1,6 +1,6 @@
{ {
"name": "@vant/icons", "name": "@vant/icons",
"version": "1.2.3", "version": "1.2.5",
"description": "vant icons", "description": "vant icons",
"main": "./src/config.js", "main": "./src/config.js",
"files": [ "files": [

2
packages/vant-icons/src/config.js
View File

@ -103,6 +103,7 @@ module.exports = {
'desktop-o', 'desktop-o',
'apps-o', 'apps-o',
'home-o', 'home-o',
'back-top',
'search', 'search',
'points', 'points',
'edit', 'edit',
@ -237,5 +238,6 @@ module.exports = {
'bars', 'bars',
'wap-nav', 'wap-nav',
'enlarge', 'enlarge',
'photo-fail',
], ],
}; };

2
packages/vant-icons/src/encode.less
View File

File diff suppressed because one or more lines are too long

14
packages/vant-icons/src/index.less
View File

@ -5,9 +5,9 @@
font-family: 'vant-icon'; font-family: 'vant-icon';
font-style: normal; font-style: normal;
font-display: auto; font-display: auto;
src: url('https://img.yzcdn.cn/vant/vant-icon-6ae417.woff2') format('woff2'), src: url('https://img.yzcdn.cn/vant/vant-icon-eeb192.woff2') format('woff2'),
url('https://img.yzcdn.cn/vant/vant-icon-6ae417.woff') format('woff'), url('https://img.yzcdn.cn/vant/vant-icon-eeb192.woff') format('woff'),
url('https://img.yzcdn.cn/vant/vant-icon-6ae417.ttf') format('truetype'); url('https://img.yzcdn.cn/vant/vant-icon-eeb192.ttf') format('truetype');
} }
.van-icon { .van-icon {
@ -83,6 +83,10 @@
content: '\F00E'; content: '\F00E';
} }
.van-icon-back-top::before {
content: '\F0E6';
}
.van-icon-bag-o::before { .van-icon-bag-o::before {
content: '\F00F'; content: '\F00F';
} }
@ -651,6 +655,10 @@
content: '\F09B'; content: '\F09B';
} }
.van-icon-photo-fail::before {
content: '\F0E5';
}
.van-icon-photo-o::before { .van-icon-photo-o::before {
content: '\F09C'; content: '\F09C';
} }

6
src/address-edit/index.js
View File

@ -260,7 +260,7 @@ export default createComponent({
}, },
}, },
render() { render(h) {
const { data, errorInfo, searchResult, disableArea } = this; const { data, errorInfo, searchResult, disableArea } = this;
const onFocus = (name) => () => this.onFocus(name); const onFocus = (name) => () => this.onFocus(name);
@ -334,7 +334,7 @@ export default createComponent({
)} )}
{this.slots()} {this.slots()}
</div> </div>
{this.showSetDefault && ( {this.showSetDefault ? (
<SwitchCell <SwitchCell
class={bem('default')} class={bem('default')}
vModel={data.isDefault} vModel={data.isDefault}
@ -344,6 +344,8 @@ export default createComponent({
this.$emit('change-default', event); this.$emit('change-default', event);
}} }}
/> />
) : (
h()
)} )}
<div vShow={!hideBottomFields} class={bem('buttons')}> <div vShow={!hideBottomFields} class={bem('buttons')}>
<Button <Button

2
src/address-edit/test/__snapshots__/index.spec.js.snap
View File

@ -35,6 +35,7 @@ exports[`create a AddressEdit 1`] = `
</div> </div>
</div> </div>
</div> </div>
<!---->
<div class="van-address-edit__buttons"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round"> <div class="van-address-edit__buttons"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round">
<div class="van-button__content"><span class="van-button__text">保存</span></div> <div class="van-button__content"><span class="van-button__text">保存</span></div>
</button></div> </button></div>
@ -296,6 +297,7 @@ exports[`valid area placeholder confirm 1`] = `
</div> </div>
</div> </div>
</div> </div>
<!---->
<div class="van-address-edit__buttons"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round"> <div class="van-address-edit__buttons"><button class="van-button van-button--danger van-button--normal van-button--block van-button--round">
<div class="van-button__content"><span class="van-button__text">保存</span></div> <div class="van-button__content"><span class="van-button__text">保存</span></div>
</button></div> </button></div>

17
src/calendar/components/Month.js
View File

@ -1,4 +1,5 @@
import { createNamespace } from '../../utils'; import { createNamespace } from '../../utils';
import { setScrollTop } from '../../utils/dom/scroll';
import { import {
t, t,
bem, bem,
@ -107,12 +108,16 @@ export default createComponent({
return this.height; return this.height;
}, },
scrollIntoView() { scrollIntoView(body) {
if (this.showSubtitle) { const { days, month } = this.$refs;
this.$refs.days.scrollIntoView(); const el = this.showSubtitle ? days : month;
} else {
this.$refs.month.scrollIntoView(); const scrollTop =
} el.getBoundingClientRect().top -
body.getBoundingClientRect().top +
body.scrollTop;
setScrollTop(body, scrollTop);
}, },
getMultipleDayType(day) { getMultipleDayType(day) {

3
src/calendar/index.js
View File

@ -208,7 +208,8 @@ export default createComponent({
this.months.some((month, index) => { this.months.some((month, index) => {
if (compareMonth(month, targetDate) === 0) { if (compareMonth(month, targetDate) === 0) {
this.$refs.months[index].scrollIntoView(); const { body, months } = this.$refs;
months[index].scrollIntoView(body);
return true; return true;
} }

22
src/calendar/test/index.spec.js
View File

@ -457,28 +457,6 @@ test('color prop when type is range', async () => {
expect(wrapper).toMatchSnapshot(); expect(wrapper).toMatchSnapshot();
}); });
test('should scroll to current month when show', async (done) => {
const wrapper = mount(Calendar, {
propsData: {
type: 'range',
minDate: new Date(2010, 0, 10),
maxDate: new Date(2010, 11, 10),
defaultDate: [new Date(2010, 3, 1), new Date(2010, 5, 1)],
},
});
Element.prototype.scrollIntoView = function () {
expect(this.parentNode).toEqual(
wrapper.findAll('.van-calendar__month').at(3).element
);
done();
};
wrapper.setProps({ value: true });
await later();
});
test('close event', () => { test('close event', () => {
const wrapper = mount(Calendar, { const wrapper = mount(Calendar, {
propsData: { propsData: {

3
src/calendar/test/prop.spec.js
View File

@ -197,6 +197,7 @@ test('first day of week', async () => {
propsData: { propsData: {
poppable: false, poppable: false,
defaultDate: new Date(2020, 7, 1), defaultDate: new Date(2020, 7, 1),
minDate: new Date(2020, 7, 1),
maxDate: new Date(2020, 7, 30), maxDate: new Date(2020, 7, 30),
firstDayOfWeek: 2, firstDayOfWeek: 2,
}, },
@ -210,5 +211,5 @@ test('first day of week', async () => {
'.van-calendar__month:first-of-type .van-calendar__day' '.van-calendar__month:first-of-type .van-calendar__day'
); );
expect(day.text()).toEqual('1'); expect(day.text()).toEqual('1');
expect(day.attributes('style')).toContain(`margin-left: ${100 / 7}%`); expect(day.attributes('style')).toContain(`margin-left: ${(100 * 4) / 7}%`);
}); });

6
src/card/test/__snapshots__/demo.spec.js.snap
View File

@ -6,7 +6,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-card"> <div class="van-card">
<div class="van-card__header"><a class="van-card__thumb"> <div class="van-card__header"><a class="van-card__thumb">
<div class="van-image" style="width: 100%; height: 100%;"><img src="https://img.yzcdn.cn/vant/ipad.jpeg" class="van-image__img" style="object-fit: cover;"> <div class="van-image" style="width: 100%; height: 100%;"><img src="https://img.yzcdn.cn/vant/ipad.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
</a> </a>
@ -29,7 +29,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-card"> <div class="van-card">
<div class="van-card__header"><a class="van-card__thumb"> <div class="van-card__header"><a class="van-card__thumb">
<div class="van-image" style="width: 100%; height: 100%;"><img src="https://img.yzcdn.cn/vant/ipad.jpeg" class="van-image__img" style="object-fit: cover;"> <div class="van-image" style="width: 100%; height: 100%;"><img src="https://img.yzcdn.cn/vant/ipad.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-card__tag"><span class="van-tag van-tag--mark van-tag--danger">标签</span></div> <div class="van-card__tag"><span class="van-tag van-tag--mark van-tag--danger">标签</span></div>
@ -54,7 +54,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-card"> <div class="van-card">
<div class="van-card__header"><a class="van-card__thumb"> <div class="van-card__header"><a class="van-card__thumb">
<div class="van-image" style="width: 100%; height: 100%;"><img src="https://img.yzcdn.cn/vant/ipad.jpeg" class="van-image__img" style="object-fit: cover;"> <div class="van-image" style="width: 100%; height: 100%;"><img src="https://img.yzcdn.cn/vant/ipad.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
</a> </a>

2
src/coupon-cell/index.tsx
View File

@ -27,7 +27,7 @@ function formatValue(props: CouponCellProps) {
if (coupon) { if (coupon) {
const value = coupon.value || coupon.denominations || 0; const value = coupon.value || coupon.denominations || 0;
return `-${currency}${(value / 100).toFixed(2)}`; return `-${currency} ${(value / 100).toFixed(2)}`;
} }
return coupons.length === 0 ? t('tips') : t('count', coupons.length); return coupons.length === 0 ? t('tips') : t('count', coupons.length);

2
src/coupon-list/test/__snapshots__/index.spec.js.snap
View File

@ -49,7 +49,7 @@ exports[`render coupon cell 1`] = `
exports[`render coupon cell with coupon 1`] = ` exports[`render coupon cell with coupon 1`] = `
<div role="button" tabindex="0" class="van-cell van-cell--clickable van-coupon-cell"> <div role="button" tabindex="0" class="van-cell van-cell--clickable van-coupon-cell">
<div class="van-cell__title"><span>优惠券</span></div> <div class="van-cell__title"><span>优惠券</span></div>
<div class="van-cell__value van-coupon-cell--selected"><span>-¥1.00</span></div><i class="van-icon van-icon-arrow van-cell__right-icon"> <div class="van-cell__value van-coupon-cell--selected"><span>-¥ 1.00</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i> <!----></i>
</div> </div>
`; `;

44
src/dialog/Dialog.js
View File

@ -2,6 +2,8 @@ import { createNamespace, addUnit } from '../utils';
import { BORDER_TOP, BORDER_LEFT } from '../utils/constant'; import { BORDER_TOP, BORDER_LEFT } from '../utils/constant';
import Popup from '../popup'; import Popup from '../popup';
import Button from '../button'; import Button from '../button';
import GoodsAction from '../goods-action';
import GoodsActionButton from '../goods-action-button';
const [createComponent, bem, t] = createNamespace('dialog'); const [createComponent, bem, t] = createNamespace('dialog');
@ -9,6 +11,7 @@ export default createComponent({
props: { props: {
show: Boolean, show: Boolean,
title: String, title: String,
theme: String,
width: [Number, String], width: [Number, String],
message: String, message: String,
className: null, className: null,
@ -102,11 +105,44 @@ export default createComponent({
this.$emit('closed'); this.$emit('closed');
}, },
genRoundButtons() {
return (
<GoodsAction class={bem('footer')}>
{this.showCancelButton && (
<GoodsActionButton
size="large"
type="warning"
text={this.cancelButtonText || t('cancel')}
class={bem('cancel')}
color={this.cancelButtonColor}
loading={this.loading.cancel}
onClick={() => {
this.handleAction('cancel');
}}
/>
)}
{this.showConfirmButton && (
<GoodsActionButton
size="large"
type="danger"
text={this.confirmButtonText || t('confirm')}
class={bem('confirm')}
color={this.confirmButtonColor}
loading={this.loading.confirm}
onClick={() => {
this.handleAction('confirm');
}}
/>
)}
</GoodsAction>
);
},
genButtons() { genButtons() {
const multiple = this.showCancelButton && this.showConfirmButton; const multiple = this.showCancelButton && this.showConfirmButton;
return ( return (
<div class={[BORDER_TOP, bem('footer', { buttons: multiple })]}> <div class={[BORDER_TOP, bem('footer')]}>
{this.showCancelButton && ( {this.showCancelButton && (
<Button <Button
size="large" size="large"
@ -174,7 +210,7 @@ export default createComponent({
<Popup <Popup
show={this.show} show={this.show}
role="dialog" role="dialog"
class={[bem(), this.className]} class={[bem([this.theme]), this.className]}
style={{ width: addUnit(this.width) }} style={{ width: addUnit(this.width) }}
transition={this.transition} transition={this.transition}
lazyRender={this.lazyRender} lazyRender={this.lazyRender}
@ -184,7 +220,9 @@ export default createComponent({
> >
{Title} {Title}
{this.genContent(title)} {this.genContent(title)}
{this.genButtons()} {this.theme === 'round-button'
? this.genRoundButtons()
: this.genButtons()}
</Popup> </Popup>
); );
}, },

27
src/dialog/README.md
View File

@ -30,6 +30,27 @@ Dialog.alert({
}); });
``` ```
### Round Button Style
Use round button style.
```js
Dialog.alert({
title: 'Title',
message: 'Content',
theme: 'round-button',
}).then(() => {
// on close
});
Dialog.alert({
message: 'Content',
theme: 'round-button',
}).then(() => {
// on close
});
```
### Confirm dialog ### Confirm dialog
Used to confirm some messages, including a confirm button and a cancel button. Used to confirm some messages, including a confirm button and a cancel button.
@ -120,13 +141,14 @@ export default {
| width `v2.2.7` | Width | _number \| string_ | `320px` | | width `v2.2.7` | Width | _number \| string_ | `320px` |
| message | Message | _string_ | - | | message | Message | _string_ | - |
| messageAlign | Message text align，can be set to `left` `right` | _string_ | `center` | | messageAlign | Message text align，can be set to `left` `right` | _string_ | `center` |
| theme `v2.10.0` | theme style，can be set to `round` | _string_ | `default` |
| className | Custom className | _any_ | - | | className | Custom className | _any_ | - |
| showConfirmButton | Whether to show confirm button | _boolean_ | `true` | | showConfirmButton | Whether to show confirm button | _boolean_ | `true` |
| showCancelButton | Whether to show cancel button | _boolean_ | `false` | | showCancelButton | Whether to show cancel button | _boolean_ | `false` |
| cancelButtonText | Cancel button text | _string_ | `Cancel` | | cancelButtonText | Cancel button text | _string_ | `Cancel` |
| cancelButtonColor | Cancel button color | _string_ | `black` | | cancelButtonColor | Cancel button color | _string_ | `black` |
| confirmButtonText | Confirm button text | _string_ | `Confirm` | | confirmButtonText | Confirm button text | _string_ | `Confirm` |
| confirmButtonColor | Confirm button color | _string_ | `#1989fa` | | confirmButtonColor | Confirm button color | _string_ | `#ee0a24` |
| overlay | Whether to show overlay | _boolean_ | `true` | | overlay | Whether to show overlay | _boolean_ | `true` |
| overlayClass `v2.2.7` | Custom overlay class | _string_ | - | | overlayClass `v2.2.7` | Custom overlay class | _string_ | - |
| overlayStyle `v2.2.7` | Custom overlay style | _object_ | - | | overlayStyle `v2.2.7` | Custom overlay style | _object_ | - |
@ -147,12 +169,13 @@ export default {
| width `v2.2.7` | Width | _number \| string_ | `320px` | | width `v2.2.7` | Width | _number \| string_ | `320px` |
| message | Message | _string_ | - | | message | Message | _string_ | - |
| message-align | Message align，can be set to `left` `right` | _string_ | `center` | | message-align | Message align，can be set to `left` `right` | _string_ | `center` |
| theme `v2.10.0` | theme style，can be set to `round` | _string_ | `default` |
| show-confirm-button | Whether to show confirm button | _boolean_ | `true` | | show-confirm-button | Whether to show confirm button | _boolean_ | `true` |
| show-cancel-button | Whether to show cancel button | _boolean_ | `false` | | show-cancel-button | Whether to show cancel button | _boolean_ | `false` |
| cancel-button-text | Cancel button text | _string_ | `Cancel` | | cancel-button-text | Cancel button text | _string_ | `Cancel` |
| cancel-button-color | Cancel button color | _string_ | `black` | | cancel-button-color | Cancel button color | _string_ | `black` |
| confirm-button-text | Confirm button text | _string_ | `Confirm` | | confirm-button-text | Confirm button text | _string_ | `Confirm` |
| confirm-button-color | Confirm button color | _string_ | `#1989fa` | | confirm-button-color | Confirm button color | _string_ | `#ee0a24` |
| overlay | Whether to show overlay | _boolean_ | `true` | | overlay | Whether to show overlay | _boolean_ | `true` |
| overlay-class `v2.2.7` | Custom overlay class | _string_ | - | | overlay-class `v2.2.7` | Custom overlay class | _string_ | - |
| overlay-style `v2.2.7` | Custom overlay style | _object_ | - | | overlay-style `v2.2.7` | Custom overlay style | _object_ | - |

243
src/dialog/README.zh-CN.md
View File

@ -0,0 +1,243 @@
# Dialog 弹出框
### 介绍
弹出模态框，常用于消息提示、消息确认，或在当前页面内完成特定的交互操作。
弹出框组件支持函数调用和组件调用两种方式。
### 函数调用
Dialog 是一个函数，调用后会直接在页面中弹出相应的模态框。
```js
import { Dialog } from 'vant';
Dialog({ message: '提示' });
```
### 组件调用
通过组件调用 Dialog 时，可以通过下面的方式进行注册：
```js
import Vue from 'vue';
import { Dialog } from 'vant';
// 全局注册
Vue.use(Dialog);
// 局部注册
export default {
components: {
[Dialog.Component.name]: Dialog.Component,
},
};
```
## 代码演示
### 消息提示
用于提示一些消息，只包含一个确认按钮。
```js
Dialog.alert({
title: '标题',
message: '弹窗内容',
}).then(() => {
// on close
});
Dialog.alert({
message: '弹窗内容',
}).then(() => {
// on close
});
```
### 圆角按钮风格
将 theme 选项设置为 `round-button` 可以展示圆角按钮风格的弹窗，该选项从 2.10.0 版本开始支持。
```js
Dialog.alert({
title: '标题',
message: '弹窗内容',
theme: 'round-button',
}).then(() => {
// on close
});
Dialog.alert({
message: '弹窗内容',
theme: 'round-button',
}).then(() => {
// on close
});
```
### 消息确认
用于确认消息，包含取消和确认按钮。
```js
Dialog.confirm({
title: '标题',
message: '弹窗内容',
})
.then(() => {
// on confirm
})
.catch(() => {
// on cancel
});
```
### 异步关闭
通过 `beforeClose` 属性可以传入一个回调函数，在弹窗关闭前进行特定操作。
```js
function beforeClose(action, done) {
if (action === 'confirm') {
setTimeout(done, 1000);
} else {
done();
}
}
Dialog.confirm({
title: '标题',
message: '弹窗内容',
beforeClose,
});
```
### 全局方法
引入 Dialog 组件后，会自动在 Vue 的 prototype 上挂载 `$dialog` 方法，在所有组件内部都可以直接调用此方法。
```js
export default {
mounted() {
this.$dialog.alert({
message: '弹窗内容',
});
},
};
```
### 组件调用
如果需要在弹窗内嵌入组件或其他自定义内容，可以使用组件调用的方式。
```html
<van-dialog v-model="show" title="标题" show-cancel-button>
<img src="https://img.yzcdn.cn/vant/apple-3.jpg" />
</van-dialog>
```
```js
export default {
data() {
return {
show: false,
};
},
};
```
## API
### 方法
| 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- |
| Dialog | 展示弹窗 | `options` | `Promise` |
| Dialog.alert | 展示消息提示弹窗 | `options` | `Promise` |
| Dialog.confirm | 展示消息确认弹窗 | `options` | `Promise` |
| Dialog.setDefaultOptions | 修改默认配置，对所有 Dialog 生效 | `options` | `void` |
| Dialog.resetDefaultOptions | 重置默认配置，对所有 Dialog 生效 | - | `void` |
| Dialog.close | 关闭弹窗 | - | `void` |
### Options
通过函数调用 `Dialog` 时，支持传入以下选项：
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| title | 标题 | _string_ | - |
| width `v2.2.7` | 弹窗宽度，默认单位为`px` | _number \| string_ | `320px` |
| message | 文本内容，支持通过`\n`换行 | _string_ | - |
| messageAlign | 内容对齐方式，可选值为`left` `right` | _string_ | `center` |
| theme | 样式风格，可选值为`round` | _string_ | `default` |
| className | 自定义类名 | _any_ | - |
| showConfirmButton | 是否展示确认按钮 | _boolean_ | `true` |
| showCancelButton | 是否展示取消按钮 | _boolean_ | `false` |
| confirmButtonText | 确认按钮文案 | _string_ | `确认` |
| confirmButtonColor | 确认按钮颜色 | _string_ | `#ee0a24` |
| cancelButtonText | 取消按钮文案 | _string_ | `取消` |
| cancelButtonColor | 取消按钮颜色 | _string_ | `black` |
| overlay | 是否展示遮罩层 | _boolean_ | `true` |
| overlayClass `v2.2.7` | 自定义遮罩层类名 | _string_ | - |
| overlayStyle `v2.2.7` | 自定义遮罩层样式 | _object_ | - |
| closeOnPopstate `v2.0.5` | 是否在页面回退时自动关闭 | _boolean_ | `true` |
| closeOnClickOverlay | 是否在点击遮罩层后关闭弹窗 | _boolean_ | `false` |
| lockScroll | 是否锁定背景滚动 | _boolean_ | `true` |
| allowHtml `v2.8.7` | 是否允许 message 内容中渲染 HTML | _boolean_ | `true` |
| beforeClose | 关闭前的回调函数，<br>调用 done() 后关闭弹窗，<br>调用 done(false) 阻止弹窗关闭 | _(action, done) => void_ | - |
| transition `v2.2.6` | 动画类名，等价于 [transtion](https://cn.vuejs.org/v2/api/index.html#transition) 的`name`属性 | _string_ | - |
| getContainer | 指定挂载的节点，[用法示例](#/zh-CN/popup#zhi-ding-gua-zai-wei-zhi) | _string \| () => Element_ | `body` |
### Props
通过组件调用 `Dialog` 时，支持以下 Props：
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| v-model | 是否显示弹窗 | _boolean_ | - |
| title | 标题 | _string_ | - |
| width `v2.2.7` | 弹窗宽度，默认单位为`px` | _number \| string_ | `320px` |
| message | 文本内容，支持通过`\n`换行 | _string_ | - |
| message-align | 内容对齐方式，可选值为`left` `right` | _string_ | `center` |
| theme | 样式风格，可选值为`round` | _string_ | `default` |
| show-confirm-button | 是否展示确认按钮 | _boolean_ | `true` |
| show-cancel-button | 是否展示取消按钮 | _boolean_ | `false` |
| confirm-button-text | 确认按钮文案 | _string_ | `确认` |
| confirm-button-color | 确认按钮颜色 | _string_ | `#ee0a24` |
| cancel-button-text | 取消按钮文案 | _string_ | `取消` |
| cancel-button-color | 取消按钮颜色 | _string_ | `black` |
| overlay | 是否展示遮罩层 | _boolean_ | `true` |
| overlay-class `v2.2.7` | 自定义遮罩层类名 | _string_ | - |
| overlay-style `v2.2.7` | 自定义遮罩层样式 | _object_ | - |
| close-on-popstate `v2.0.5` | 是否在页面回退时自动关闭 | _boolean_ | `true` |
| close-on-click-overlay | 是否在点击遮罩层后关闭弹窗 | _boolean_ | `false` |
| lazy-render | 是否在显示弹层时才渲染节点 | _boolean_ | `true` |
| lock-scroll | 是否锁定背景滚动 | _boolean_ | `true` |
| allow-html `v2.8.7` | 是否允许 message 内容中渲染 HTML | _boolean_ | `true` |
| before-close | 关闭前的回调函数，<br>调用 done() 后关闭弹窗，<br>调用 done(false) 阻止弹窗关闭 | _(action, done) => void_ | - |
| transition `v2.2.6` | 动画类名，等价于 [transtion](https://cn.vuejs.org/v2/api/index.html#transition) 的`name`属性 | _string_ | - |
| get-container | 指定挂载的节点，[用法示例](#/zh-CN/popup#zhi-ding-gua-zai-wei-zhi) | _string \| () => Element_ | - |
### Events
通过组件调用 `Dialog` 时，支持以下事件：
| 事件 | 说明 | 回调参数 |
| ------- | ------------------------ | -------- |
| confirm | 点击确认按钮时触发 | - |
| cancel | 点击取消按钮时触发 | - |
| open | 打开弹窗时触发 | - |
| close | 关闭弹窗时触发 | - |
| opened | 打开弹窗且动画结束后触发 | - |
| closed | 关闭弹窗且动画结束后触发 | - |
### Slots
通过组件调用 `Dialog` 时，支持以下插槽：
| 名称 | 说明 |
| ------- | ---------- |
| default | 自定义内容 |
| title | 自定义标题 |

26
src/dialog/demo/index.vue
View File

@ -9,6 +9,15 @@
</van-button> </van-button>
</demo-block> </demo-block>
<demo-block :title="t('roundButton')">
<van-button type="primary" @click="onClickRound">
{{ t('alert1') }}
</van-button>
<van-button type="primary" @click="onClickRound2">
{{ t('alert2') }}
</van-button>
</demo-block>
<demo-block :title="t('confirm')"> <demo-block :title="t('confirm')">
<van-button type="primary" @click="onClickConfirm"> <van-button type="primary" @click="onClickConfirm">
{{ t('confirm') }} {{ t('confirm') }}
@ -45,6 +54,7 @@ export default {
alert2: '提示弹窗（无标题）', alert2: '提示弹窗（无标题）',
confirm: '确认弹窗', confirm: '确认弹窗',
asyncClose: '异步关闭', asyncClose: '异步关闭',
roundButton: '圆角按钮样式',
componentCall: '组件调用', componentCall: '组件调用',
content: '代码是写出来给人看的，附带能在机器上运行', content: '代码是写出来给人看的，附带能在机器上运行',
}, },
@ -53,6 +63,7 @@ export default {
alert2: 'Alert without title', alert2: 'Alert without title',
confirm: 'Confirm dialog', confirm: 'Confirm dialog',
asyncClose: 'Async Close', asyncClose: 'Async Close',
roundButton: 'Round Button Style',
componentCall: 'Component Call', componentCall: 'Component Call',
}, },
}, },
@ -79,6 +90,21 @@ export default {
}); });
}, },
onClickRound() {
this.$dialog.alert({
theme: 'round-button',
title: this.t('title'),
message: this.t('content'),
});
},
onClickRound2() {
this.$dialog.alert({
theme: 'round-button',
message: this.t('content'),
});
},
onClickConfirm() { onClickConfirm() {
this.$dialog.confirm({ this.$dialog.confirm({
title: this.t('title'), title: this.t('title'),

1
src/dialog/index.js
View File

@ -66,6 +66,7 @@ function Dialog(options) {
Dialog.defaultOptions = { Dialog.defaultOptions = {
title: '', title: '',
width: '', width: '',
theme: null,
message: '', message: '',
overlay: true, overlay: true,
callback: null, callback: null,

31
src/dialog/index.less
View File

@ -55,19 +55,15 @@
} }
&__footer { &__footer {
display: flex;
overflow: hidden; overflow: hidden;
user-select: none; user-select: none;
&--buttons {
display: flex;
.van-button {
flex: 1;
}
}
} }
.van-button { &__confirm,
&__cancel {
flex: 1;
margin: 0;
border: 0; border: 0;
} }
@ -78,6 +74,23 @@
} }
} }
&--round-button {
.van-dialog__footer {
position: relative;
height: auto;
padding: @padding-xs @padding-lg @padding-md;
}
.van-dialog__message {
padding-bottom: @padding-md;
color: @text-color;
}
.van-dialog__confirm {
color: @white;
}
}
&-bounce-enter-from { &-bounce-enter-from {
transform: translate3d(-50%, -50%, 0) scale(0.7); transform: translate3d(-50%, -50%, 0) scale(0.7);
opacity: 0; opacity: 0;

11
src/dialog/test/__snapshots__/demo.spec.js.snap
View File

@ -11,6 +11,15 @@ exports[`renders demo correctly 1`] = `
提示弹窗（无标题） 提示弹窗（无标题）
</span></div> </span></div>
</button></div> </button></div>
<div><button class="van-button van-button--primary van-button--normal">
<div class="van-button__content"><span class="van-button__text">
提示弹窗
</span></div>
</button> <button class="van-button van-button--primary van-button--normal">
<div class="van-button__content"><span class="van-button__text">
提示弹窗（无标题）
</span></div>
</button></div>
<div><button class="van-button van-button--primary van-button--normal"> <div><button class="van-button van-button--primary van-button--normal">
<div class="van-button__content"><span class="van-button__text"> <div class="van-button__content"><span class="van-button__text">
确认弹窗 确认弹窗
@ -29,7 +38,7 @@ exports[`renders demo correctly 1`] = `
<div role="dialog" aria-labelledby="标题" class="van-dialog" style="display: none;" name="van-dialog-bounce"> <div role="dialog" aria-labelledby="标题" class="van-dialog" style="display: none;" name="van-dialog-bounce">
<div class="van-dialog__header">标题</div> <div class="van-dialog__header">标题</div>
<div class="van-dialog__content"><img src="https://img.yzcdn.cn/vant/apple-3.jpg"></div> <div class="van-dialog__content"><img src="https://img.yzcdn.cn/vant/apple-3.jpg"></div>
<div class="van-hairline--top van-dialog__footer van-dialog__footer--buttons"><button class="van-button van-button--default van-button--large van-dialog__cancel"> <div class="van-hairline--top van-dialog__footer"><button class="van-button van-button--default van-button--large van-dialog__cancel">
<div class="van-button__content"><span class="van-button__text">取消</span></div> <div class="van-button__content"><span class="van-button__text">取消</span></div>
</button><button class="van-button van-button--default van-button--large van-dialog__confirm van-hairline--left"> </button><button class="van-button van-button--default van-button--large van-dialog__confirm van-hairline--left">
<div class="van-button__content"><span class="van-button__text">确认弹窗</span></div> <div class="van-button__content"><span class="van-button__text">确认弹窗</span></div>

4
src/dialog/test/__snapshots__/index.spec.js.snap
View File

@ -4,7 +4,7 @@ exports[`allow-html prop 1`] = `<div class="van-dialog__message">&lt;span&gt;tex
exports[`button color 1`] = ` exports[`button color 1`] = `
<div role="dialog" class="van-dialog" name="van-dialog-bounce"> <div role="dialog" class="van-dialog" name="van-dialog-bounce">
<div class="van-hairline--top van-dialog__footer van-dialog__footer--buttons"><button class="van-button van-button--default van-button--large van-dialog__cancel" style="color: white;"> <div class="van-hairline--top van-dialog__footer"><button class="van-button van-button--default van-button--large van-dialog__cancel" style="color: white;">
<div class="van-button__content"><span class="van-button__text">取消</span></div> <div class="van-button__content"><span class="van-button__text">取消</span></div>
</button><button class="van-button van-button--default van-button--large van-dialog__confirm van-hairline--left" style="color: red;"> </button><button class="van-button van-button--default van-button--large van-dialog__confirm van-hairline--left" style="color: red;">
<div class="van-button__content"><span class="van-button__text">确认</span></div> <div class="van-button__content"><span class="van-button__text">确认</span></div>
@ -14,7 +14,7 @@ exports[`button color 1`] = `
exports[`button text 1`] = ` exports[`button text 1`] = `
<div role="dialog" class="van-dialog" name="van-dialog-bounce"> <div role="dialog" class="van-dialog" name="van-dialog-bounce">
<div class="van-hairline--top van-dialog__footer van-dialog__footer--buttons"><button class="van-button van-button--default van-button--large van-dialog__cancel"> <div class="van-hairline--top van-dialog__footer"><button class="van-button van-button--default van-button--large van-dialog__cancel">
<div class="van-button__content"><span class="van-button__text">Custom cancel</span></div> <div class="van-button__content"><span class="van-button__text">Custom cancel</span></div>
</button><button class="van-button van-button--default van-button--large van-dialog__confirm van-hairline--left"> </button><button class="van-button van-button--default van-button--large van-dialog__confirm van-hairline--left">
<div class="van-button__content"><span class="van-button__text">Custom confirm</span></div> <div class="van-button__content"><span class="van-button__text">Custom confirm</span></div>

14
src/dropdown-menu/README.md
View File

@ -48,8 +48,16 @@ export default {
<van-dropdown-menu> <van-dropdown-menu>
<van-dropdown-item v-model="value" :options="option" /> <van-dropdown-item v-model="value" :options="option" />
<van-dropdown-item title="Title" ref="item"> <van-dropdown-item title="Title" ref="item">
<van-switch-cell v-model="switch1" title="Title" /> <van-cell center title="Title">
<van-switch-cell v-model="switch2" title="Title" /> <template #right-icon>
<van-switch v-model="switch1" size="24" active-color="#ee0a24" />
</template>
</van-cell>
<van-cell center title="Title">
<template #right-icon>
<van-switch v-model="switch2" size="24" active-color="#ee0a24" />
</template>
</van-cell>
<div style="padding: 5px 16px;"> <div style="padding: 5px 16px;">
<van-button type="danger" block round @click="onConfirm"> <van-button type="danger" block round @click="onConfirm">
Confirm Confirm
@ -86,7 +94,7 @@ export default {
Use `active-color` prop to custom active color of the title and options Use `active-color` prop to custom active color of the title and options
```html ```html
<van-dropdown-menu active-color="#ee0a24"> <van-dropdown-menu active-color="#1989fa">
<van-dropdown-item v-model="value1" :options="option1" /> <van-dropdown-item v-model="value1" :options="option1" />
<van-dropdown-item v-model="value2" :options="option2" /> <van-dropdown-item v-model="value2" :options="option2" />
</van-dropdown-menu> </van-dropdown-menu>

14
src/dropdown-menu/README.zh-CN.md
View File

@ -50,8 +50,16 @@ export default {
<van-dropdown-menu> <van-dropdown-menu>
<van-dropdown-item v-model="value" :options="option" /> <van-dropdown-item v-model="value" :options="option" />
<van-dropdown-item title="筛选" ref="item"> <van-dropdown-item title="筛选" ref="item">
<van-switch-cell v-model="switch1" title="包邮" /> <van-cell center title="包邮">
<van-switch-cell v-model="switch2" title="团购" /> <template #right-icon>
<van-switch v-model="switch1" size="24" active-color="#ee0a24" />
</template>
</van-cell>
<van-cell center title="团购">
<template #right-icon>
<van-switch v-model="switch2" size="24" active-color="#ee0a24" />
</template>
</van-cell>
<div style="padding: 5px 16px;"> <div style="padding: 5px 16px;">
<van-button type="danger" block round @click="onConfirm"> <van-button type="danger" block round @click="onConfirm">
确认 确认
@ -88,7 +96,7 @@ export default {
通过`active-color`属性可以自定义菜单标题和选项的选中态颜色 通过`active-color`属性可以自定义菜单标题和选项的选中态颜色
```html ```html
<van-dropdown-menu active-color="#ee0a24"> <van-dropdown-menu active-color="#1989fa">
<van-dropdown-item v-model="value1" :options="option1" /> <van-dropdown-item v-model="value1" :options="option1" />
<van-dropdown-item v-model="value2" :options="option2" /> <van-dropdown-item v-model="value2" :options="option2" />
</van-dropdown-menu> </van-dropdown-menu>

18
src/dropdown-menu/demo/index.vue
View File

@ -11,8 +11,16 @@
<van-dropdown-menu> <van-dropdown-menu>
<van-dropdown-item v-model="value1" :options="option1" /> <van-dropdown-item v-model="value1" :options="option1" />
<van-dropdown-item :title="t('itemTitle')" ref="item"> <van-dropdown-item :title="t('itemTitle')" ref="item">
<van-switch-cell v-model="switch1" :title="t('switchTitle1')" /> <van-cell center :title="t('switchTitle1')">
<van-switch-cell v-model="switch2" :title="t('switchTitle2')" /> <template #right-icon>
<van-switch v-model="switch1" size="24" :active-color="RED" />
</template>
</van-cell>
<van-cell center :title="t('switchTitle2')">
<template #right-icon>
<van-switch v-model="switch2" size="24" :active-color="RED" />
</template>
</van-cell>
<div style="padding: 5px 16px;"> <div style="padding: 5px 16px;">
<van-button <van-button
type="danger" type="danger"
@ -29,7 +37,7 @@
</demo-block> </demo-block>
<demo-block :title="t('customActiveColor')"> <demo-block :title="t('customActiveColor')">
<van-dropdown-menu active-color="#ee0a24"> <van-dropdown-menu :active-color="BLUE">
<van-dropdown-item v-model="value1" :options="option1" /> <van-dropdown-item v-model="value1" :options="option1" />
<van-dropdown-item v-model="value2" :options="option2" /> <van-dropdown-item v-model="value2" :options="option2" />
</van-dropdown-menu> </van-dropdown-menu>
@ -52,6 +60,8 @@
</template> </template>
<script> <script>
import { RED, BLUE } from '../../utils/constant';
export default { export default {
i18n: { i18n: {
'zh-CN': { 'zh-CN': {
@ -96,6 +106,8 @@ export default {
data() { data() {
return { return {
RED,
BLUE,
switch1: true, switch1: true,
switch2: false, switch2: false,
value1: 0, value1: 0,

2
src/dropdown-menu/index.less
View File

@ -8,7 +8,7 @@
display: flex; display: flex;
height: @dropdown-menu-height; height: @dropdown-menu-height;
background-color: @dropdown-menu-background-color; background-color: @dropdown-menu-background-color;
box-shadow: 0 2px 12px fade(@gray-7, 8); box-shadow: @dropdown-menu-box-shadow;
&--opened { &--opened {
z-index: @dropdown-item-z-index + 1; z-index: @dropdown-item-z-index + 1;

2
src/empty/test/__snapshots__/demo.spec.js.snap
View File

@ -10,7 +10,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">通用错误</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">通用错误</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">网络错误</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">网络错误</span></div>

2
src/form/test/__snapshots__/demo.spec.js.snap
View File

@ -175,7 +175,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/leaf.jpg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/leaf.jpg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon"> <div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon">

1
src/goods-action-button/index.js
View File

@ -47,7 +47,6 @@ export default createComponent({
}, },
this.type, this.type,
])} ])}
square
size="large" size="large"
type={this.type} type={this.type}
icon={this.icon} icon={this.icon}

1
src/goods-action-button/index.less
View File

@ -6,6 +6,7 @@
font-weight: @font-weight-bold; font-weight: @font-weight-bold;
font-size: @font-size-md; font-size: @font-size-md;
border: none; border: none;
border-radius: 0;
&--first { &--first {
margin-left: 5px; margin-left: 5px;

14
src/goods-action/test/__snapshots__/demo.spec.js.snap
View File

@ -18,7 +18,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-icon van-icon-shop-o van-goods-action-icon__icon"> <div class="van-icon van-icon-shop-o van-goods-action-icon__icon">
<!----> <!---->
</div>店铺 </div>店铺
</div> <button class="van-button van-button--danger van-button--large van-button--square van-goods-action-button van-goods-action-button--first van-goods-action-button--last van-goods-action-button--danger"> </div> <button class="van-button van-button--danger van-button--large van-goods-action-button van-goods-action-button--first van-goods-action-button--last van-goods-action-button--danger">
<div class="van-button__content"><span class="van-button__text">立即购买</span></div> <div class="van-button__content"><span class="van-button__text">立即购买</span></div>
</button> </button>
</div> </div>
@ -39,9 +39,9 @@ exports[`renders demo correctly 1`] = `
<div class="van-icon van-icon-shop-o van-goods-action-icon__icon"> <div class="van-icon van-icon-shop-o van-goods-action-icon__icon">
<div class="van-info">12</div> <div class="van-info">12</div>
</div>店铺 </div>店铺
</div> <button class="van-button van-button--warning van-button--large van-button--square van-goods-action-button van-goods-action-button--first van-goods-action-button--warning"> </div> <button class="van-button van-button--warning van-button--large van-goods-action-button van-goods-action-button--first van-goods-action-button--warning">
<div class="van-button__content"><span class="van-button__text">加入购物车</span></div> <div class="van-button__content"><span class="van-button__text">加入购物车</span></div>
</button> <button class="van-button van-button--danger van-button--large van-button--square van-goods-action-button van-goods-action-button--last van-goods-action-button--danger"> </button> <button class="van-button van-button--danger van-button--large van-goods-action-button van-goods-action-button--last van-goods-action-button--danger">
<div class="van-button__content"><span class="van-button__text">立即购买</span></div> <div class="van-button__content"><span class="van-button__text">立即购买</span></div>
</button> </button>
</div> </div>
@ -62,9 +62,9 @@ exports[`renders demo correctly 1`] = `
<div class="van-icon van-icon-star van-goods-action-icon__icon" style="color: rgb(255, 80, 0);"> <div class="van-icon van-icon-star van-goods-action-icon__icon" style="color: rgb(255, 80, 0);">
<!----> <!---->
</div>已收藏 </div>已收藏
</div> <button class="van-button van-button--warning van-button--large van-button--square van-goods-action-button van-goods-action-button--first van-goods-action-button--warning"> </div> <button class="van-button van-button--warning van-button--large van-goods-action-button van-goods-action-button--first van-goods-action-button--warning">
<div class="van-button__content"><span class="van-button__text">加入购物车</span></div> <div class="van-button__content"><span class="van-button__text">加入购物车</span></div>
</button> <button class="van-button van-button--danger van-button--large van-button--square van-goods-action-button van-goods-action-button--last van-goods-action-button--danger"> </button> <button class="van-button van-button--danger van-button--large van-goods-action-button van-goods-action-button--last van-goods-action-button--danger">
<div class="van-button__content"><span class="van-button__text">立即购买</span></div> <div class="van-button__content"><span class="van-button__text">立即购买</span></div>
</button> </button>
</div> </div>
@ -80,9 +80,9 @@ exports[`renders demo correctly 1`] = `
<div class="van-icon van-icon-cart-o van-goods-action-icon__icon"> <div class="van-icon van-icon-cart-o van-goods-action-icon__icon">
<!----> <!---->
</div>购物车 </div>购物车
</div> <button class="van-button van-button--warning van-button--large van-button--square van-goods-action-button van-goods-action-button--first van-goods-action-button--warning" style="color: rgb(255, 255, 255); background: rgb(190, 153, 255); border-color: #be99ff;"> </div> <button class="van-button van-button--warning van-button--large van-goods-action-button van-goods-action-button--first van-goods-action-button--warning" style="color: rgb(255, 255, 255); background: rgb(190, 153, 255); border-color: #be99ff;">
<div class="van-button__content"><span class="van-button__text">加入购物车</span></div> <div class="van-button__content"><span class="van-button__text">加入购物车</span></div>
</button> <button class="van-button van-button--danger van-button--large van-button--square van-goods-action-button van-goods-action-button--last van-goods-action-button--danger" style="color: rgb(255, 255, 255); background: rgb(114, 50, 221); border-color: #7232dd;"> </button> <button class="van-button van-button--danger van-button--large van-goods-action-button van-goods-action-button--last van-goods-action-button--danger" style="color: rgb(255, 255, 255); background: rgb(114, 50, 221); border-color: #7232dd;">
<div class="van-button__content"><span class="van-button__text">立即购买</span></div> <div class="van-button__content"><span class="van-button__text">立即购买</span></div>
</button> </button>
</div> </div>

2
src/goods-action/test/__snapshots__/index.spec.js.snap
View File

@ -1,7 +1,7 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP // Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Button render default slot 1`] = ` exports[`Button render default slot 1`] = `
<button class="van-button van-button--default van-button--large van-button--square van-goods-action-button van-goods-action-button--first van-goods-action-button--last"> <button class="van-button van-button--default van-button--large van-goods-action-button van-goods-action-button--first van-goods-action-button--last">
<div class="van-button__content"><span class="van-button__text">Default Content</span></div> <div class="van-button__content"><span class="van-button__text">Default Content</span></div>
</button> </button>
`; `;

6
src/grid/test/__snapshots__/demo.spec.js.snap
View File

@ -55,7 +55,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-grid-item" style="flex-basis: 33.333333333333336%;"> <div class="van-grid-item" style="flex-basis: 33.333333333333336%;">
<div class="van-grid-item__content van-grid-item__content--center"> <div class="van-grid-item__content van-grid-item__content--center">
<div class="van-image"><img src="https://img.yzcdn.cn/vant/apple-1.jpg" class="van-image__img" style="object-fit: contain;"> <div class="van-image"><img src="https://img.yzcdn.cn/vant/apple-1.jpg" class="van-image__img" style="object-fit: contain;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
</div> </div>
@ -63,7 +63,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-grid-item" style="flex-basis: 33.333333333333336%;"> <div class="van-grid-item" style="flex-basis: 33.333333333333336%;">
<div class="van-grid-item__content van-grid-item__content--center"> <div class="van-grid-item__content van-grid-item__content--center">
<div class="van-image"><img src="https://img.yzcdn.cn/vant/apple-2.jpg" class="van-image__img" style="object-fit: contain;"> <div class="van-image"><img src="https://img.yzcdn.cn/vant/apple-2.jpg" class="van-image__img" style="object-fit: contain;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
</div> </div>
@ -71,7 +71,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-grid-item" style="flex-basis: 33.333333333333336%;"> <div class="van-grid-item" style="flex-basis: 33.333333333333336%;">
<div class="van-grid-item__content van-grid-item__content--center"> <div class="van-grid-item__content van-grid-item__content--center">
<div class="van-image"><img src="https://img.yzcdn.cn/vant/apple-3.jpg" class="van-image__img" style="object-fit: contain;"> <div class="van-image"><img src="https://img.yzcdn.cn/vant/apple-3.jpg" class="van-image__img" style="object-fit: contain;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
</div> </div>

2
src/icon/demo/index.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<demo-section> <demo-section>
<van-tabs v-model="tab" sticky :color="BLUE"> <van-tabs v-model="tab" sticky>
<van-tab :title="t('demo')"> <van-tab :title="t('demo')">
<demo-block :title="t('basicUsage')"> <demo-block :title="t('basicUsage')">
<van-col span="6" @click="copy(demoIcon)"> <van-col span="6" @click="copy(demoIcon)">

1
src/icon/index.less
View File

@ -3,7 +3,6 @@
.van-icon { .van-icon {
&__image { &__image {
display: block;
width: 1em; width: 1em;
height: 1em; height: 1em;
object-fit: contain; object-fit: contain;

4
src/image/README.md
View File

@ -75,8 +75,8 @@ Vue.use(Lazyload);
| lazy-load | Whether to enable lazy load，should register [Lazyload](#/en-US/lazyload) component | _boolean_ | `false` | | lazy-load | Whether to enable lazy load，should register [Lazyload](#/en-US/lazyload) component | _boolean_ | `false` |
| show-error `v2.0.9` | Whether to show error placeholder | _boolean_ | `true` | | show-error `v2.0.9` | Whether to show error placeholder | _boolean_ | `true` |
| show-loading `v2.0.9` | Whether to show loading placeholder | _boolean_ | `true` | | show-loading `v2.0.9` | Whether to show loading placeholder | _boolean_ | `true` |
| error-icon `v2.4.2` | Error icon | _string_ | `warning-o` | | error-icon `v2.4.2` | Error icon | _string_ | `photo-fail` |
| loading-icon `v2.4.2` | Loading icon | _string_ | `photo-o` | | loading-icon `v2.4.2` | Loading icon | _string_ | `photo` |
### fit optional value ### fit optional value

4
src/image/README.zh-CN.md
View File

@ -107,8 +107,8 @@ Vue.use(Lazyload);
| lazy-load | 是否开启图片懒加载，须配合 [Lazyload](#/zh-CN/lazyload) 组件使用 | _boolean_ | `false` | | lazy-load | 是否开启图片懒加载，须配合 [Lazyload](#/zh-CN/lazyload) 组件使用 | _boolean_ | `false` |
| show-error `v2.0.9` | 是否展示图片加载失败提示 | _boolean_ | `true` | | show-error `v2.0.9` | 是否展示图片加载失败提示 | _boolean_ | `true` |
| show-loading `v2.0.9` | 是否展示图片加载中提示 | _boolean_ | `true` | | show-loading `v2.0.9` | 是否展示图片加载中提示 | _boolean_ | `true` |
| error-icon `v2.4.2` | 失败时提示的[图标名称](#/zh-CN/icon)或图片链接 | _string_ | `warning-o` | | error-icon `v2.4.2` | 失败时提示的[图标名称](#/zh-CN/icon)或图片链接 | _string_ | `photo-fail` |
| loading-icon `v2.4.2` | 加载时提示的[图标名称](#/zh-CN/icon)或图片链接 | _string_ | `photo-o` | | loading-icon `v2.4.2` | 加载时提示的[图标名称](#/zh-CN/icon)或图片链接 | _string_ | `photo` |
### 图片填充模式  ### 图片填充模式 

4
src/image/index.js
View File

@ -23,11 +23,11 @@ export default createComponent({
}, },
errorIcon: { errorIcon: {
type: String, type: String,
default: 'warning-o', default: 'photo-fail',
}, },
loadingIcon: { loadingIcon: {
type: String, type: String,
default: 'photo-o', default: 'photo',
}, },
}, },

2
src/image/index.less
View File

@ -36,10 +36,12 @@
} }
&__loading-icon { &__loading-icon {
color: @image-loading-icon-color;
font-size: @image-loading-icon-size; font-size: @image-loading-icon-size;
} }
&__error-icon { &__error-icon {
color: @image-error-icon-color;
font-size: @image-error-icon-size; font-size: @image-error-icon-size;
} }
} }

28
src/image/test/__snapshots__/demo.spec.js.snap
View File

@ -5,7 +5,7 @@ exports[`renders demo correctly 1`] = `
<div> <div>
<div class="van-row"> <div class="van-row">
<div class="van-image" style="width: 100px; height: 100px;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img"> <div class="van-image" style="width: 100px; height: 100px;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
</div> </div>
@ -14,35 +14,35 @@ exports[`renders demo correctly 1`] = `
<div class="van-row"> <div class="van-row">
<div class="van-col van-col--8" style="padding-right: 13.333333333333334px;"> <div class="van-col van-col--8" style="padding-right: 13.333333333333334px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: contain;"> <div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: contain;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">contain</div> <div class="text">contain</div>
</div> </div>
<div class="van-col van-col--8" style="padding-left: 6.666666666666666px; padding-right: 6.666666666666668px;"> <div class="van-col van-col--8" style="padding-left: 6.666666666666666px; padding-right: 6.666666666666668px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;"> <div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">cover</div> <div class="text">cover</div>
</div> </div>
<div class="van-col van-col--8" style="padding-left: 13.333333333333332px;"> <div class="van-col van-col--8" style="padding-left: 13.333333333333332px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: fill;"> <div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: fill;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">fill</div> <div class="text">fill</div>
</div> </div>
<div class="van-col van-col--8" style="padding-right: 10px;"> <div class="van-col van-col--8" style="padding-right: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: none;"> <div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: none;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">none</div> <div class="text">none</div>
</div> </div>
<div class="van-col van-col--8" style="padding-left: 10px;"> <div class="van-col van-col--8" style="padding-left: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: scale-down;"> <div class="van-image" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: scale-down;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">scale-down</div> <div class="text">scale-down</div>
@ -53,35 +53,35 @@ exports[`renders demo correctly 1`] = `
<div class="van-row"> <div class="van-row">
<div class="van-col van-col--8" style="padding-right: 13.333333333333334px;"> <div class="van-col van-col--8" style="padding-right: 13.333333333333334px;">
<div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: contain;"> <div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: contain;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">contain</div> <div class="text">contain</div>
</div> </div>
<div class="van-col van-col--8" style="padding-left: 6.666666666666666px; padding-right: 6.666666666666668px;"> <div class="van-col van-col--8" style="padding-left: 6.666666666666666px; padding-right: 6.666666666666668px;">
<div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">cover</div> <div class="text">cover</div>
</div> </div>
<div class="van-col van-col--8" style="padding-left: 13.333333333333332px;"> <div class="van-col van-col--8" style="padding-left: 13.333333333333332px;">
<div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: fill;"> <div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: fill;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">fill</div> <div class="text">fill</div>
</div> </div>
<div class="van-col van-col--8" style="padding-right: 10px;"> <div class="van-col van-col--8" style="padding-right: 10px;">
<div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: none;"> <div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: none;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">none</div> <div class="text">none</div>
</div> </div>
<div class="van-col van-col--8" style="padding-left: 10px;"> <div class="van-col van-col--8" style="padding-left: 10px;">
<div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: scale-down;"> <div class="van-image van-image--round" style="width: 100%; height: 27vw;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: scale-down;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">scale-down</div> <div class="text">scale-down</div>
@ -92,7 +92,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-row"> <div class="van-row">
<div class="van-col van-col--8" style="padding-right: 10px;"> <div class="van-col van-col--8" style="padding-right: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img class="van-image__img"> <div class="van-image" style="width: 100%; height: 27vw;"><img class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">默认提示</div> <div class="text">默认提示</div>
@ -111,14 +111,14 @@ exports[`renders demo correctly 1`] = `
<div class="van-row"> <div class="van-row">
<div class="van-col van-col--8" style="padding-right: 10px;"> <div class="van-col van-col--8" style="padding-right: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="x" class="van-image__img"> <div class="van-image" style="width: 100%; height: 27vw;"><img src="x" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">默认提示</div> <div class="text">默认提示</div>
</div> </div>
<div class="van-col van-col--8" style="padding-left: 10px;"> <div class="van-col van-col--8" style="padding-left: 10px;">
<div class="van-image" style="width: 100%; height: 27vw;"><img src="x" class="van-image__img"> <div class="van-image" style="width: 100%; height: 27vw;"><img src="x" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="text">自定义提示</div> <div class="text">自定义提示</div>

10
src/image/test/__snapshots__/index.spec.js.snap
View File

@ -2,7 +2,7 @@
exports[`default slot 1`] = ` exports[`default slot 1`] = `
<div class="van-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img"> <div class="van-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div>Custom Default <!----></i></div>Custom Default
</div> </div>
`; `;
@ -16,14 +16,14 @@ exports[`error-icon prop 1`] = `
exports[`lazy load 1`] = ` exports[`lazy load 1`] = `
<div class="van-image"><img class="van-image__img"> <div class="van-image"><img class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
`; `;
exports[`lazy-load error event 1`] = ` exports[`lazy-load error event 1`] = `
<div class="van-image"> <div class="van-image">
<div class="van-image__error"><i class="van-icon van-icon-warning-o van-image__error-icon"> <div class="van-image__error"><i class="van-icon van-icon-photo-fail van-image__error-icon">
<!----></i></div> <!----></i></div>
</div> </div>
`; `;
@ -34,7 +34,7 @@ exports[`load event 1`] = `<div class="van-image"><img src="https://img.yzcdn.cn
exports[`load event 2`] = ` exports[`load event 2`] = `
<div class="van-image"><img src="" class="van-image__img"> <div class="van-image"><img src="" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
`; `;
@ -48,7 +48,7 @@ exports[`loading-icon prop 1`] = `
exports[`radius prop 1`] = ` exports[`radius prop 1`] = `
<div class="van-image" style="overflow: hidden; border-radius: 3px;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img"> <div class="van-image" style="overflow: hidden; border-radius: 3px;"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
`; `;

6
src/index-bar/demo/index.vue
View File

@ -1,6 +1,6 @@
<template> <template>
<demo-section> <demo-section>
<van-tabs v-model="activeTab" :color="BLUE"> <van-tabs v-model="activeTab">
<van-tab :title="t('basicUsage')"> <van-tab :title="t('basicUsage')">
<van-index-bar> <van-index-bar>
<div v-for="index in indexList" :key="index"> <div v-for="index in indexList" :key="index">
@ -29,8 +29,6 @@
</template> </template>
<script> <script>
import { BLUE } from '../../utils/constant';
export default { export default {
i18n: { i18n: {
'zh-CN': { 'zh-CN': {
@ -46,12 +44,12 @@ export default {
data() { data() {
const indexList = []; const indexList = [];
const charCodeOfA = 'A'.charCodeAt(0); const charCodeOfA = 'A'.charCodeAt(0);
for (let i = 0; i < 26; i++) { for (let i = 0; i < 26; i++) {
indexList.push(String.fromCharCode(charCodeOfA + i)); indexList.push(String.fromCharCode(charCodeOfA + i));
} }
return { return {
BLUE,
activeTab: 0, activeTab: 0,
indexList, indexList,
customIndexList: [1, 2, 3, 4, 5, 6, 8, 9, 10], customIndexList: [1, 2, 3, 4, 5, 6, 8, 9, 10],

6
src/index-bar/test/__snapshots__/demo.spec.js.snap
View File

@ -3,11 +3,11 @@
exports[`renders demo correctly 1`] = ` exports[`renders demo correctly 1`] = `
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line" style="border-color: #1989fa;"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">基础用法</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">基础用法</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">自定义索引列表</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">自定义索引列表</span></div>
<div class="van-tabs__line" style="background-color: rgb(25, 137, 250); width: 0px; transform: translateX(0px) translateX(-50%);"></div> <div class="van-tabs__line" style="width: 0px; transform: translateX(0px) translateX(-50%);"></div>
</div> </div>
</div> </div>
<div class="van-tabs__content"> <div class="van-tabs__content">

3
src/info/index.less
View File

@ -10,8 +10,7 @@
color: @info-color; color: @info-color;
font-weight: @info-font-weight; font-weight: @info-font-weight;
font-size: @info-font-size; font-size: @info-font-size;
font-family: @info-font-family; line-height: 1.2;
line-height: @info-size - @info-border-width * 2;
text-align: center; text-align: center;
background-color: @info-background-color; background-color: @info-background-color;
border: @info-border-width solid @white; border: @info-border-width solid @white;

2
src/list/test/__snapshots__/demo.spec.js.snap
View File

@ -3,7 +3,7 @@
exports[`renders demo correctly 1`] = ` exports[`renders demo correctly 1`] = `
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">基础用法</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">基础用法</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">错误提示</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">错误提示</span></div>

4
src/mixins/popup/index.js
View File

@ -87,6 +87,10 @@ export function PopupMixin(options = {}) {
beforeDestroy() { beforeDestroy() {
this.removeLock(); this.removeLock();
if (this.opened) {
this.removeLock();
}
if (this.getContainer) { if (this.getContainer) {
removeNode(this.$refs.root); removeNode(this.$refs.root);
} }

13
src/number-keyboard/index.less
View File

@ -6,8 +6,7 @@
left: 0; left: 0;
z-index: @number-keyboard-z-index; z-index: @number-keyboard-z-index;
width: 100%; width: 100%;
padding-bottom: constant(safe-area-inset-bottom); padding-bottom: 22px;
padding-bottom: env(safe-area-inset-bottom);
background-color: @number-keyboard-background-color; background-color: @number-keyboard-background-color;
user-select: none; user-select: none;
@ -87,7 +86,14 @@
cursor: pointer; cursor: pointer;
&--large { &--large {
height: 100%; // height: 100% can't fill flex parent on legacy safari
// see: https://stackoverflow.com/questions/33636796
position: absolute;
top: 0;
right: 6px;
bottom: 6px;
left: 0;
height: auto;
} }
&--blue, &--blue,
@ -109,6 +115,7 @@
} }
&__wrapper { &__wrapper {
position: relative;
flex: 1; flex: 1;
flex-basis: 33%; flex-basis: 33%;
box-sizing: border-box; box-sizing: border-box;

4
src/picker/index.js
View File

@ -335,7 +335,9 @@ export default createComponent({
allowHtml={this.allowHtml} allowHtml={this.allowHtml}
className={item.className} className={item.className}
itemHeight={this.itemPxHeight} itemHeight={this.itemPxHeight}
defaultIndex={item.defaultIndex || +this.defaultIndex} defaultIndex={
isDef(item.defaultIndex) ? item.defaultIndex : +this.defaultIndex
}
swipeDuration={this.swipeDuration} swipeDuration={this.swipeDuration}
visibleItemCount={this.visibleItemCount} visibleItemCount={this.visibleItemCount}
initialOptions={item.values} initialOptions={item.values}

2
src/pull-refresh/test/__snapshots__/demo.spec.js.snap
View File

@ -3,7 +3,7 @@
exports[`renders demo correctly 1`] = ` exports[`renders demo correctly 1`] = `
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">基础用法</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">基础用法</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">成功提示</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">成功提示</span></div>

1
src/share-sheet/README.md
View File

@ -131,6 +131,7 @@ export default {
| name | Option name | _string_ | | name | Option name | _string_ |
| description `v2.8.5` | Option description | _string_ | | description `v2.8.5` | Option description | _string_ |
| icon | Option icon，can be set to `wechat` `weibo` `qq` `link` `qrcode` `poster` or image URL | _string_ | | icon | Option icon，can be set to `wechat` `weibo` `qq` `link` `qrcode` `poster` or image URL | _string_ |
| className | Option className is used to set the class props to the share item | _string_ |
### Events ### Events

1
src/share-sheet/README.zh-CN.md
View File

@ -179,6 +179,7 @@ export default {
| name | 分享渠道名称 | _string_ | | name | 分享渠道名称 | _string_ |
| description `v2.8.5` | 分享选项描述 | _string_ | | description `v2.8.5` | 分享选项描述 | _string_ |
| icon | 图标，可选值为 `wechat` `weibo` `qq` `link` `qrcode` `poster`，支持传入图片 URL | _string_ | | icon | 图标，可选值为 `wechat` `weibo` `qq` `link` `qrcode` `poster`，支持传入图片 URL | _string_ |
| className | 分享选项类名 | _string_ |
### Events ### Events

2
src/share-sheet/index.js
View File

@ -90,7 +90,7 @@ export default createComponent({
<div <div
role="button" role="button"
tabindex="0" tabindex="0"
class={bem('option')} class={[bem('option'), option.className]}
onClick={() => { onClick={() => {
this.onSelect(option, index); this.onSelect(option, index);
}} }}

13
src/share-sheet/test/index.spec.js
View File

@ -29,6 +29,19 @@ test('description prop', () => {
expect(wrapper.contains('.van-share-sheet__description')).toBeFalsy(); expect(wrapper.contains('.van-share-sheet__description')).toBeFalsy();
}); });
test('option className', () => {
const wrapper = mount(ShareSheet, {
propsData: {
value: true,
options: [{ name: 'Link', icon: 'link', className: 'foo' }],
},
});
const option = wrapper.find('.van-share-sheet__option').element;
expect(option.className.includes('foo')).toBeTruthy();
});
test('select event', () => { test('select event', () => {
const wrapper = mount(ShareSheet, { const wrapper = mount(ShareSheet, {
propsData: { propsData: {

2
src/sku/components/SkuDateTimeField.js
View File

@ -27,6 +27,7 @@ export default createComponent({
return { return {
showDatePicker: false, showDatePicker: false,
currentDate: this.type === 'time' ? '' : new Date(), currentDate: this.type === 'time' ? '' : new Date(),
minDate: new Date(new Date().getFullYear() - 60, 0, 1),
}; };
}, },
@ -94,6 +95,7 @@ export default createComponent({
type={this.type} type={this.type}
title={this.title} title={this.title}
value={this.currentDate} value={this.currentDate}
minDate={this.minDate}
formatter={this.formatter} formatter={this.formatter}
onCancel={this.onCancel} onCancel={this.onCancel}
onConfirm={this.onConfirm} onConfirm={this.onConfirm}

3
src/sku/index.less
View File

@ -30,6 +30,7 @@
margin: 0 @padding-md; margin: 0 @padding-md;
&__img-wrap { &__img-wrap {
flex-shrink: 0;
width: 96px; width: 96px;
height: 96px; height: 96px;
margin: @padding-sm @padding-sm @padding-sm 0; margin: @padding-sm @padding-sm @padding-sm 0;
@ -65,6 +66,8 @@
} }
&__goods-price { &__goods-price {
// for price align
margin-left: -2px;
color: @red; color: @red;
} }

4
src/stepper/index.js
View File

@ -273,7 +273,9 @@ export default createComponent({
render() { render() {
const createListeners = (type) => ({ const createListeners = (type) => ({
on: { on: {
click: () => { click: (e) => {
// disable double tap scrolling on mobile safari
e.preventDefault();
this.type = type; this.type = type;
this.onChange(); this.onChange();
}, },

14
src/style/var.less
View File

@ -313,8 +313,8 @@
@dialog-message-line-height: @line-height-md; @dialog-message-line-height: @line-height-md;
@dialog-message-max-height: 60vh; @dialog-message-max-height: 60vh;
@dialog-has-title-message-text-color: @gray-7; @dialog-has-title-message-text-color: @gray-7;
@dialog-has-title-message-padding-top: @padding-sm; @dialog-has-title-message-padding-top: @padding-xs;
@dialog-confirm-button-text-color: @blue; @dialog-confirm-button-text-color: @red;
// Divider // Divider
@divider-margin: @padding-md 0; @divider-margin: @padding-md 0;
@ -329,6 +329,7 @@
// DropdownMenu // DropdownMenu
@dropdown-menu-height: 48px; @dropdown-menu-height: 48px;
@dropdown-menu-background-color: @white; @dropdown-menu-background-color: @white;
@dropdown-menu-box-shadow: 0 2px 12px fade(@gray-7, 12);
@dropdown-menu-title-font-size: 15px; @dropdown-menu-title-font-size: 15px;
@dropdown-menu-title-text-color: @text-color; @dropdown-menu-title-text-color: @text-color;
@dropdown-menu-title-active-text-color: @red; @dropdown-menu-title-active-text-color: @red;
@ -418,14 +419,15 @@
@info-background-color: @red; @info-background-color: @red;
@info-dot-color: @red; @info-dot-color: @red;
@info-dot-size: 8px; @info-dot-size: 8px;
@info-font-family: @price-integer-font-family;
// Image // Image
@image-placeholder-text-color: @gray-6; @image-placeholder-text-color: @gray-6;
@image-placeholder-font-size: @font-size-md; @image-placeholder-font-size: @font-size-md;
@image-placeholder-background-color: @background-color; @image-placeholder-background-color: @background-color;
@image-loading-icon-size: 22px; @image-loading-icon-size: 32px;
@image-error-icon-size: 22px; @image-loading-icon-color: @gray-4;
@image-error-icon-size: 32px;
@image-error-icon-color: @gray-4;
// ImagePreview // ImagePreview
@image-preview-index-text-color: @white; @image-preview-index-text-color: @white;
@ -485,7 +487,7 @@
// NumberKeyboard // NumberKeyboard
@number-keyboard-background-color: @gray-2; @number-keyboard-background-color: @gray-2;
@number-keyboard-key-height: 56px; @number-keyboard-key-height: 48px;
@number-keyboard-key-font-size: 28px; @number-keyboard-key-font-size: 28px;
@number-keyboard-key-active-color: @gray-3; @number-keyboard-key-active-color: @gray-3;
@number-keyboard-delete-font-size: @font-size-lg; @number-keyboard-delete-font-size: @font-size-lg;

2
src/swipe-cell/test/__snapshots__/demo.spec.js.snap
View File

@ -27,7 +27,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-card"> <div class="van-card">
<div class="van-card__header"><a class="van-card__thumb"> <div class="van-card__header"><a class="van-card__thumb">
<div class="van-image" style="width: 100%; height: 100%;"><img src="https://img.yzcdn.cn/vant/ipad.jpeg" class="van-image__img" style="object-fit: cover;"> <div class="van-image" style="width: 100%; height: 100%;"><img src="https://img.yzcdn.cn/vant/ipad.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
</a> </a>

6
src/tab/README.md
View File

@ -56,7 +56,7 @@ export default {
### Swipe Tabs ### Swipe Tabs
By default more than 4 tabs, you can scroll through the tabs. You can set `swipe-threshold` attribute to customize threshold number. By default more than 5 tabs, you can scroll through the tabs. You can set `swipe-threshold` attribute to customize threshold number.
```html ```html
<van-tabs> <van-tabs>
@ -227,14 +227,14 @@ export default {
| line-width | Width of tab line | _number \| string_ | Width of active tab | | line-width | Width of tab line | _number \| string_ | Width of active tab |
| line-height | Height of tab line | _number \| string_ | `3px` | | line-height | Height of tab line | _number \| string_ | `3px` |
| animated | Whether to change tabs with animation | _boolean_ | `false` | | animated | Whether to change tabs with animation | _boolean_ | `false` |
| border | Whether to show border when `type="line"` | _boolean_ | `true` | | border | Whether to show border when `type="line"` | _boolean_ | `false` |
| ellipsis | Whether to ellipsis too long title | _boolean_ | `true` | | ellipsis | Whether to ellipsis too long title | _boolean_ | `true` |
| sticky | Whether to use sticky mode | _boolean_ | `false` | | sticky | Whether to use sticky mode | _boolean_ | `false` |
| swipeable | Whether to switch tabs with swipe gestrue in the content | _boolean_ | `false` | | swipeable | Whether to switch tabs with swipe gestrue in the content | _boolean_ | `false` |
| lazy-render | Whether to enable tab content lazy render | _boolean_ | `true` | | lazy-render | Whether to enable tab content lazy render | _boolean_ | `true` |
| scrollspy `v2.3.0` | Whether to use scrollspy mode | _boolean_ | `false` | | scrollspy `v2.3.0` | Whether to use scrollspy mode | _boolean_ | `false` |
| offset-top `v2.8.7` | Sticky offset top , supports `px` `vw` `rem` unit, default `px` | _number \| string_ | `0` | | offset-top `v2.8.7` | Sticky offset top , supports `px` `vw` `rem` unit, default `px` | _number \| string_ | `0` |
| swipe-threshold | Set swipe tabs threshold | _number \| string_ | `4` | - | | swipe-threshold | Set swipe tabs threshold | _number \| string_ | `5` | - |
| title-active-color | Title active color | _string_ | - | | title-active-color | Title active color | _string_ | - |
| title-inactive-color | Title inactive color | _string_ | - | | title-inactive-color | Title inactive color | _string_ | - |
| before-change `v2.9.3` | Callback function before changing tabs，return `false` to prevent change，support return Promise | _(name) => boolean \| Promise_ | - | | before-change `v2.9.3` | Callback function before changing tabs，return `false` to prevent change，support return Promise | _(name) => boolean \| Promise_ | - |

8
src/tab/README.zh-CN.md
View File

@ -59,7 +59,7 @@ export default {
### 标签栏滚动 ### 标签栏滚动
标签数量超过 4 个时，标签栏可以在水平方向上滚动，切换时会自动将当前标签居中。 标签数量超过 5 个时，标签栏可以在水平方向上滚动，切换时会自动将当前标签居中。
```html ```html
<van-tabs> <van-tabs>
@ -227,21 +227,21 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | | 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |
| v-model:active | 绑定当前选中标签的标识符 | _number \| string_ | `0` | | v-model:active | 绑定当前选中标签的标识符 | _number \| string_ | `0` |
| type | 样式风格类型，可选值为`card` | _string_ | `line` | | type | 样式风格类型，可选值为 `card` | _string_ | `line` |
| color | 标签主题色 | _string_ | `#ee0a24` | | color | 标签主题色 | _string_ | `#ee0a24` |
| background | 标签栏背景色 | _string_ | `white` | | background | 标签栏背景色 | _string_ | `white` |
| duration | 动画时间，单位秒 | _number \| string_ | `0.3` | | duration | 动画时间，单位秒 | _number \| string_ | `0.3` |
| line-width | 底部条宽度，默认单位`px` | _number \| string_ | `auto` | | line-width | 底部条宽度，默认单位`px` | _number \| string_ | `auto` |
| line-height | 底部条高度，默认单位`px` | _number \| string_ | `3px` | | line-height | 底部条高度，默认单位`px` | _number \| string_ | `3px` |
| animated | 是否开启切换标签内容时的转场动画 | _boolean_ | `false` | | animated | 是否开启切换标签内容时的转场动画 | _boolean_ | `false` |
| border | 是否显示标签栏外边框，仅在`type="line"`时有效 | _boolean_ | `true` | | border | 是否显示标签栏外边框，仅在 `type="line"` 时有效 | _boolean_ | `false` |
| ellipsis | 是否省略过长的标题文字 | _boolean_ | `true` | | ellipsis | 是否省略过长的标题文字 | _boolean_ | `true` |
| sticky | 是否使用粘性定位布局 | _boolean_ | `false` | | sticky | 是否使用粘性定位布局 | _boolean_ | `false` |
| swipeable | 是否开启手势滑动切换 | _boolean_ | `false` | | swipeable | 是否开启手势滑动切换 | _boolean_ | `false` |
| lazy-render | 是否开启延迟渲染（首次切换到标签时才触发内容渲染） | _boolean_ | `true` | | lazy-render | 是否开启延迟渲染（首次切换到标签时才触发内容渲染） | _boolean_ | `true` |
| scrollspy `v2.3.0` | 是否开启滚动导航 | _boolean_ | `false` | | scrollspy `v2.3.0` | 是否开启滚动导航 | _boolean_ | `false` |
| offset-top `v2.8.7` | 粘性定位布局下与顶部的最小距离，支持 `px` `vw` `rem` 单位，默认 `px` | _number \| string_ | `0` | | offset-top `v2.8.7` | 粘性定位布局下与顶部的最小距离，支持 `px` `vw` `rem` 单位，默认 `px` | _number \| string_ | `0` |
| swipe-threshold | 滚动阈值，标签数量超过阈值时开始横向滚动 | _number \| string_ | `4` | | swipe-threshold | 滚动阈值，标签数量超过阈值时开始横向滚动 | _number \| string_ | `5` |
| title-active-color | 标题选中态颜色 | _string_ | - | | title-active-color | 标题选中态颜色 | _string_ | - |
| title-inactive-color | 标题默认态颜色 | _string_ | - | | title-inactive-color | 标题默认态颜色 | _string_ | - |
| before-change `v2.9.3` | 切换标签前的回调函数，返回 `false` 可阻止切换，支持返回 Promise | _(name) => boolean \| Promise_ | - | | before-change `v2.9.3` | 切换标签前的回调函数，返回 `false` 可阻止切换，支持返回 Promise | _(name) => boolean \| Promise_ | - |

2
src/tab/demo/index.vue
View File

@ -182,7 +182,7 @@ export default {
} }
.van-tab__pane { .van-tab__pane {
padding: 25px 20px; padding: 24px 20px;
background-color: @white; background-color: @white;
} }

58
src/tab/test/__snapshots__/demo.spec.js.snap
View File

@ -4,7 +4,7 @@ exports[`renders demo correctly 1`] = `
<div> <div>
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div>
@ -31,7 +31,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div>
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div>
@ -52,16 +52,16 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-tabs__wrap--scrollable van-hairline--top-bottom"> <div class="van-tabs__wrap van-tabs__wrap--scrollable">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line van-tabs__nav--complete">
<div role="tab" aria-selected="true" class="van-tab van-tab--active" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text">标签 1</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 2</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 3</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 3</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 4</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 4</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 5</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 5</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 6</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 6</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 7</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 7</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 8</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 8</span></div>
<div class="van-tabs__line" style="width: 0px; transform: translateX(0px) translateX(-50%);"></div> <div class="van-tabs__line" style="width: 0px; transform: translateX(0px) translateX(-50%);"></div>
</div> </div>
</div> </div>
@ -95,7 +95,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div>
<div role="tab" class="van-tab van-tab--disabled"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div> <div role="tab" class="van-tab van-tab--disabled"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div>
@ -140,7 +140,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div>
@ -161,7 +161,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div> <div>
<div class="van-sticky"> <div class="van-sticky">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div>
@ -190,7 +190,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis"><i class="van-icon van-icon-more-o"><!----></i>标签 </span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis"><i class="van-icon van-icon-more-o"><!----></i>标签 </span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis"><i class="van-icon van-icon-more-o"><!----></i>标签 </span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis"><i class="van-icon van-icon-more-o"><!----></i>标签 </span></div>
@ -209,7 +209,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div>
@ -246,7 +246,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div>
@ -275,16 +275,16 @@ exports[`renders demo correctly 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div> <div>
<div class="van-sticky"> <div class="van-sticky">
<div class="van-tabs__wrap van-tabs__wrap--scrollable van-hairline--top-bottom"> <div class="van-tabs__wrap van-tabs__wrap--scrollable">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line van-tabs__nav--complete">
<div role="tab" aria-selected="true" class="van-tab van-tab--active" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text">标签 1</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 2</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 3</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 3</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 4</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 4</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 5</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 5</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 6</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 6</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 7</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 7</span></div>
<div role="tab" class="van-tab" style="flex-basis: 22%;"><span class="van-tab__text van-tab__text--ellipsis">标签 8</span></div> <div role="tab" class="van-tab"><span class="van-tab__text">标签 8</span></div>
<div class="van-tabs__line" style="width: 0px; transform: translateX(0px) translateX(-50%);"></div> <div class="van-tabs__line" style="width: 0px; transform: translateX(0px) translateX(-50%);"></div>
</div> </div>
</div> </div>
@ -320,7 +320,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div> <div>
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">标签 1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">标签 2</span></div>

28
src/tab/test/__snapshots__/index.spec.js.snap
View File

@ -15,7 +15,7 @@ exports[`change tabs data 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div> <div>
<div class="van-sticky"> <div class="van-sticky">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line" style="border-color: #ee0a24;"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line" style="border-color: #ee0a24;">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
@ -60,7 +60,7 @@ exports[`change tabs data 2`] = `
exports[`click to switch tab 1`] = ` exports[`click to switch tab 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
@ -82,7 +82,7 @@ exports[`click to switch tab 1`] = `
exports[`click to switch tab 2`] = ` exports[`click to switch tab 2`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab van-tab--active" aria-selected="true"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab van-tab--active" aria-selected="true"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
@ -102,7 +102,7 @@ exports[`click to switch tab 2`] = `
exports[`dot prop 1`] = ` exports[`dot prop 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text-wrapper"><span class="van-tab__text van-tab__text--ellipsis"></span> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text-wrapper"><span class="van-tab__text van-tab__text--ellipsis"></span>
<div class="van-info van-info--dot"></div> <div class="van-info van-info--dot"></div>
@ -118,7 +118,7 @@ exports[`dot prop 1`] = `
exports[`info prop 1`] = ` exports[`info prop 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text-wrapper"><span class="van-tab__text van-tab__text--ellipsis"></span> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text-wrapper"><span class="van-tab__text van-tab__text--ellipsis"></span>
<div class="van-info">10</div> <div class="van-info">10</div>
@ -136,7 +136,7 @@ exports[`lazy render 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div> <div>
<div class="van-sticky"> <div class="van-sticky">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line" style="border-color: #ee0a24;"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line" style="border-color: #ee0a24;">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
@ -162,7 +162,7 @@ exports[`lazy render 2`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div> <div>
<div class="van-sticky"> <div class="van-sticky">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line" style="border-color: #ee0a24;"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line" style="border-color: #ee0a24;">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
@ -182,7 +182,7 @@ exports[`lazy render 2`] = `
exports[`name prop 1`] = ` exports[`name prop 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
@ -206,7 +206,7 @@ exports[`render nav-left & nav-right slot 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div> <div>
<div class="van-sticky"> <div class="van-sticky">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line" style="border-color: #ee0a24;">Nav Left<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tablist" class="van-tabs__nav van-tabs__nav--line" style="border-color: #ee0a24;">Nav Left<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
<div role="tab" class="van-tab van-tab--disabled"><span class="van-tab__text van-tab__text--ellipsis">title3</span></div> <div role="tab" class="van-tab van-tab--disabled"><span class="van-tab__text van-tab__text--ellipsis">title3</span></div>
@ -233,7 +233,7 @@ exports[`scrollspy prop 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div> <div>
<div class="van-sticky"> <div class="van-sticky">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
@ -255,7 +255,7 @@ exports[`scrollspy prop 2`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div> <div>
<div class="van-sticky"> <div class="van-sticky">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
@ -275,7 +275,7 @@ exports[`scrollspy prop 2`] = `
exports[`swipe to switch tab 1`] = ` exports[`swipe to switch tab 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
@ -297,7 +297,7 @@ exports[`swipe to switch tab 1`] = `
exports[`swipe to switch tab 2`] = ` exports[`swipe to switch tab 2`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>
@ -317,7 +317,7 @@ exports[`swipe to switch tab 2`] = `
exports[`swipe to switch tab 3`] = ` exports[`swipe to switch tab 3`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">title1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">title2</span></div>

4
src/tab/test/__snapshots__/insert.spec.js.snap
View File

@ -2,7 +2,7 @@
exports[`insert tab dynamically 1`] = ` exports[`insert tab dynamically 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">1</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">1</span></div>
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">2</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">2</span></div>
@ -24,7 +24,7 @@ exports[`insert tab dynamically 1`] = `
exports[`insert tab with child component 1`] = ` exports[`insert tab with child component 1`] = `
<div class="van-tabs van-tabs--line"> <div class="van-tabs van-tabs--line">
<div class="van-tabs__wrap van-hairline--top-bottom"> <div class="van-tabs__wrap">
<div role="tablist" class="van-tabs__nav van-tabs__nav--line"> <div role="tablist" class="van-tabs__nav van-tabs__nav--line">
<div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">1</span></div> <div role="tab" aria-selected="true" class="van-tab van-tab--active"><span class="van-tab__text van-tab__text--ellipsis">1</span></div>
<div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">2</span></div> <div role="tab" class="van-tab"><span class="van-tab__text van-tab__text--ellipsis">2</span></div>

8
src/tabs/Title.js
View File

@ -11,7 +11,6 @@ export default createComponent({
color: String, color: String,
title: String, title: String,
isActive: Boolean, isActive: Boolean,
ellipsis: Boolean,
disabled: Boolean, disabled: Boolean,
scrollable: Boolean, scrollable: Boolean,
activeColor: String, activeColor: String,
@ -44,10 +43,6 @@ export default createComponent({
style.color = titleColor; style.color = titleColor;
} }
if (this.scrollable && this.ellipsis) {
style.flexBasis = `${88 / this.swipeThreshold}%`;
}
return style; return style;
}, },
}, },
@ -59,7 +54,7 @@ export default createComponent({
genText() { genText() {
const Text = ( const Text = (
<span class={bem('text', { ellipsis: this.ellipsis })}> <span class={bem('text', { ellipsis: !this.scrollable })}>
{this.renderTitle ? this.renderTitle() : this.title} {this.renderTitle ? this.renderTitle() : this.title}
</span> </span>
); );
@ -86,7 +81,6 @@ export default createComponent({
bem({ bem({
active: this.isActive, active: this.isActive,
disabled: this.disabled, disabled: this.disabled,
complete: !this.ellipsis,
}), }),
]} ]}
style={this.style} style={this.style}

12
src/tabs/index.js
View File

@ -42,6 +42,7 @@ export default createComponent({
props: { props: {
color: String, color: String,
border: Boolean,
sticky: Boolean, sticky: Boolean,
animated: Boolean, animated: Boolean,
swipeable: Boolean, swipeable: Boolean,
@ -60,10 +61,6 @@ export default createComponent({
type: [Number, String], type: [Number, String],
default: 0, default: 0,
}, },
border: {
type: Boolean,
default: true,
},
ellipsis: { ellipsis: {
type: Boolean, type: Boolean,
default: true, default: true,
@ -82,7 +79,7 @@ export default createComponent({
}, },
swipeThreshold: { swipeThreshold: {
type: [Number, String], type: [Number, String],
default: 4, default: 5,
}, },
}, },
@ -367,7 +364,7 @@ export default createComponent({
}, },
render() { render() {
const { type, ellipsis, animated, scrollable } = this; const { type, animated, scrollable } = this;
const Nav = this.children.map((item, index) => { const Nav = this.children.map((item, index) => {
return ( return (
@ -382,7 +379,6 @@ export default createComponent({
color={this.color} color={this.color}
style={item.titleStyle} style={item.titleStyle}
isActive={index === this.currentIndex} isActive={index === this.currentIndex}
ellipsis={ellipsis}
disabled={item.disabled} disabled={item.disabled}
scrollable={scrollable} scrollable={scrollable}
renderTitle={item.$slots.title} renderTitle={item.$slots.title}
@ -407,7 +403,7 @@ export default createComponent({
<div <div
ref="nav" ref="nav"
role="tablist" role="tablist"
class={bem('nav', [type])} class={bem('nav', [type, { complete: this.scrollable }])}
style={this.navStyle} style={this.navStyle}
> >
{this.$slots['nav-left']?.()} {this.$slots['nav-left']?.()}

12
src/tabs/index.less
View File

@ -53,11 +53,8 @@
&--scrollable { &--scrollable {
.van-tab { .van-tab {
flex: 0 0 22%; flex: 1 0 auto;
padding: 0 @padding-sm;
&--complete {
flex: 1 0 auto;
}
} }
.van-tabs__nav { .van-tabs__nav {
@ -68,6 +65,11 @@
&::-webkit-scrollbar { &::-webkit-scrollbar {
display: none; display: none;
} }
&--complete {
padding-right: 8px;
padding-left: 8px;
}
} }
} }
} }

6
src/tag/demo/index.vue
View File

@ -36,9 +36,9 @@
</demo-block> </demo-block>
<demo-block :title="t('customSize')"> <demo-block :title="t('customSize')">
<van-tag type="success">{{ t('tag') }}</van-tag> <van-tag type="danger">{{ t('tag') }}</van-tag>
<van-tag type="success" size="medium">{{ t('tag') }}</van-tag> <van-tag type="danger" size="medium">{{ t('tag') }}</van-tag>
<van-tag type="success" size="large">{{ t('tag') }}</van-tag> <van-tag type="danger" size="large">{{ t('tag') }}</van-tag>
</demo-block> </demo-block>
<demo-block :title="t('closeable')"> <demo-block :title="t('closeable')">

2
src/tag/test/__snapshots__/demo.spec.js.snap
View File

@ -7,7 +7,7 @@ exports[`renders demo correctly 1`] = `
<div><span class="van-tag van-tag--mark van-tag--primary">标签</span> <span class="van-tag van-tag--mark van-tag--success">标签</span> <span class="van-tag van-tag--mark van-tag--danger">标签</span> <span class="van-tag van-tag--mark van-tag--warning">标签</span></div> <div><span class="van-tag van-tag--mark van-tag--primary">标签</span> <span class="van-tag van-tag--mark van-tag--success">标签</span> <span class="van-tag van-tag--mark van-tag--danger">标签</span> <span class="van-tag van-tag--mark van-tag--warning">标签</span></div>
<div><span class="van-tag van-tag--plain van-tag--primary">标签</span> <span class="van-tag van-tag--plain van-tag--success">标签</span> <span class="van-tag van-tag--plain van-tag--danger">标签</span> <span class="van-tag van-tag--plain van-tag--warning">标签</span></div> <div><span class="van-tag van-tag--plain van-tag--primary">标签</span> <span class="van-tag van-tag--plain van-tag--success">标签</span> <span class="van-tag van-tag--plain van-tag--danger">标签</span> <span class="van-tag van-tag--plain van-tag--warning">标签</span></div>
<div><span class="van-tag van-tag--default" style="background-color: rgb(242, 130, 106);">标签</span> <span class="van-tag van-tag--default" style="background-color: rgb(114, 50, 221);">标签</span> <span class="van-tag van-tag--plain van-tag--default" style="color: rgb(114, 50, 221);">标签</span> <span class="van-tag van-tag--default" style="background-color: rgb(255, 225, 225); color: rgb(173, 0, 0);">标签</span></div> <div><span class="van-tag van-tag--default" style="background-color: rgb(242, 130, 106);">标签</span> <span class="van-tag van-tag--default" style="background-color: rgb(114, 50, 221);">标签</span> <span class="van-tag van-tag--plain van-tag--default" style="color: rgb(114, 50, 221);">标签</span> <span class="van-tag van-tag--default" style="background-color: rgb(255, 225, 225); color: rgb(173, 0, 0);">标签</span></div>
<div><span class="van-tag van-tag--success">标签</span> <span class="van-tag van-tag--medium van-tag--success">标签</span> <span class="van-tag van-tag--large van-tag--success">标签</span></div> <div><span class="van-tag van-tag--danger">标签</span> <span class="van-tag van-tag--medium van-tag--danger">标签</span> <span class="van-tag van-tag--large van-tag--danger">标签</span></div>
<div><span class="van-tag van-tag--medium van-tag--primary" name="van-fade"> <div><span class="van-tag van-tag--medium van-tag--primary" name="van-fade">
标签 标签
<i class="van-icon van-icon-cross van-tag__close"><!----></i></span> <span class="van-tag van-tag--medium van-tag--success" name="van-fade"> <i class="van-icon van-icon-cross van-tag__close"><!----></i></span> <span class="van-tag van-tag--medium van-tag--success" name="van-fade">

12
src/toast/README.md
View File

@ -24,12 +24,6 @@ Toast.loading({
message: 'Loading...', message: 'Loading...',
forbidClick: true, forbidClick: true,
}); });
Toast.loading({
message: 'Loading...',
forbidClick: true,
loadingType: 'spinner',
});
``` ```
### Success/Fail ### Success/Fail
@ -51,6 +45,12 @@ Toast({
message: 'Custom Image', message: 'Custom Image',
icon: 'https://img.yzcdn.cn/vant/logo.png', icon: 'https://img.yzcdn.cn/vant/logo.png',
}); });
Toast.loading({
message: 'Loading...',
forbidClick: true,
loadingType: 'spinner',
});
``` ```
### Update Message ### Update Message

20
src/toast/README.zh-CN.md
View File

@ -23,20 +23,13 @@ Toast('提示内容');
### 加载提示 ### 加载提示
使用 `Toast.loading` 方法展示加载提示，通过 `forbidClick` 属性可以禁用背景点击，通过`loadingType` 属性可以自定义加载图标类型。 使用 `Toast.loading` 方法展示加载提示，通过 `forbidClick` 属性可以禁用背景点击。
```js ```js
Toast.loading({ Toast.loading({
message: '加载中...', message: '加载中...',
forbidClick: true, forbidClick: true,
}); });
// 自定义加载图标
Toast.loading({
message: '加载中...',
forbidClick: true,
loadingType: 'spinner',
});
``` ```
### 成功/失败提示 ### 成功/失败提示
@ -50,7 +43,7 @@ Toast.fail('失败文案');
### 自定义图标 ### 自定义图标
通过 `icon` 选项可以自定义图标，支持传入[图标名称](#/zh-CN/icon)或图片链接。 通过 `icon` 选项可以自定义图标，支持传入[图标名称](#/zh-CN/icon)或图片链接，通过`loadingType` 属性可以自定义加载图标类型。
```js ```js
Toast({ Toast({
@ -59,9 +52,16 @@ Toast({
}); });
Toast({ Toast({
message: '展示图片', message: '自定义图片',
icon: 'https://img.yzcdn.cn/vant/logo.png', icon: 'https://img.yzcdn.cn/vant/logo.png',
}); });
// 自定义加载图标
Toast.loading({
message: '加载中...',
forbidClick: true,
loadingType: 'spinner',
});
``` ```
### 动态更新提示 ### 动态更新提示

76
src/toast/demo/index.vue
View File

@ -1,53 +1,26 @@
<template> <template>
<demo-section> <demo-section>
<demo-block :title="t('title1')"> <demo-block card :title="t('basicUsage')">
<van-button <van-cell is-link :title="t('title1')" @click="$toast(t('text'))" />
type="primary" <van-cell is-link :title="t('title2')" @click="showLoadingToast()" />
:text="t('title1')" <van-cell is-link :title="t('success')" @click="showSuccessToast" />
@click="$toast(t('text'))" <van-cell is-link :title="t('fail')" @click="showFailToast" />
/>
<van-button
type="primary"
:text="t('longTextButton')"
@click="$toast(t('longText'))"
/>
</demo-block> </demo-block>
<demo-block :title="t('title2')"> <demo-block card v-if="!isWeapp" :title="t('customIcon')">
<van-button <van-cell is-link :title="t('customIcon')" @click="showIconToast" />
type="primary" <van-cell is-link :title="t('customImage')" @click="showImageToast" />
:text="t('title2')" <van-cell
@click="showLoadingToast()" is-link
/> :title="t('loadingType')"
<van-button
type="primary"
:text="t('loadingType')"
@click="showLoadingToast('spinner')" @click="showLoadingToast('spinner')"
/> />
</demo-block> </demo-block>
<demo-block :title="t('title3')"> <demo-block card :title="t('updateMessage')">
<van-button type="info" :text="t('success')" @click="showSuccessToast" /> <van-cell
<van-button type="danger" :text="t('fail')" @click="showFailToast" /> is-link
</demo-block> :title="t('updateMessage')"
<demo-block v-if="!isWeapp" :title="t('customIcon')">
<van-button
type="primary"
:text="t('customIcon')"
@click="showIconToast"
/>
<van-button
type="primary"
:text="t('customImage')"
@click="showImageToast"
/>
</demo-block>
<demo-block :title="t('updateMessage')">
<van-button
type="primary"
:text="t('updateMessage')"
@click="showCustomizedToast" @click="showCustomizedToast"
/> />
</demo-block> </demo-block>
@ -64,13 +37,11 @@ export default {
success: '成功提示', success: '成功提示',
fail: '失败提示', fail: '失败提示',
text: '提示内容', text: '提示内容',
longText: '这是一条长文字提示，超过一定字数就会换行',
text2: '成功文案', text2: '成功文案',
text3: '失败文案', text3: '失败文案',
customIcon: '自定义图标', customIcon: '自定义图标',
customImage: '展示图片', customImage: '自定义图片',
text4: (second) => `倒计时 ${second} 秒`, text4: (second) => `倒计时 ${second} 秒`,
longTextButton: '长文字提示',
updateMessage: '动态更新提示', updateMessage: '动态更新提示',
loadingType: '自定义加载图标', loadingType: '自定义加载图标',
}, },
@ -81,14 +52,11 @@ export default {
success: 'Success', success: 'Success',
fail: 'Fail', fail: 'Fail',
text: 'Some messages', text: 'Some messages',
longText:
'This is a long message, text will wrap when over a certain length',
text2: 'Success', text2: 'Success',
text3: 'Fail', text3: 'Fail',
customIcon: 'Custom Icon', customIcon: 'Custom Icon',
customImage: 'Custom Image', customImage: 'Custom Image',
text4: (second) => `${second} seconds`, text4: (second) => `${second} seconds`,
longTextButton: 'Long Text',
updateMessage: 'Update Message', updateMessage: 'Update Message',
loadingType: 'Loading Type', loadingType: 'Loading Type',
}, },
@ -146,15 +114,3 @@ export default {
}, },
}; };
</script> </script>
<style lang="less">
@import '../../style/var';
.demo-toast {
background-color: @white;
.van-button {
margin-left: @padding-md;
}
}
</style>

61
src/toast/test/__snapshots__/demo.spec.js.snap
View File

@ -2,28 +2,43 @@
exports[`renders demo correctly 1`] = ` exports[`renders demo correctly 1`] = `
<div> <div>
<div><button class="van-button van-button--primary van-button--normal"> <div>
<div class="van-button__content"><span class="van-button__text">文字提示</span></div> <div role="button" tabindex="0" class="van-cell van-cell--clickable">
</button> <button class="van-button van-button--primary van-button--normal"> <div class="van-cell__title"><span>文字提示</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<div class="van-button__content"><span class="van-button__text">长文字提示</span></div> <!----></i>
</button></div> </div>
<div><button class="van-button van-button--primary van-button--normal"> <div role="button" tabindex="0" class="van-cell van-cell--clickable">
<div class="van-button__content"><span class="van-button__text">加载提示</span></div> <div class="van-cell__title"><span>加载提示</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
</button> <button class="van-button van-button--primary van-button--normal"> <!----></i>
<div class="van-button__content"><span class="van-button__text">自定义加载图标</span></div> </div>
</button></div> <div role="button" tabindex="0" class="van-cell van-cell--clickable">
<div><button class="van-button van-button--info van-button--normal"> <div class="van-cell__title"><span>成功提示</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<div class="van-button__content"><span class="van-button__text">成功提示</span></div> <!----></i>
</button> <button class="van-button van-button--danger van-button--normal"> </div>
<div class="van-button__content"><span class="van-button__text">失败提示</span></div> <div role="button" tabindex="0" class="van-cell van-cell--clickable">
</button></div> <div class="van-cell__title"><span>失败提示</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<div><button class="van-button van-button--primary van-button--normal"> <!----></i>
<div class="van-button__content"><span class="van-button__text">自定义图标</span></div> </div>
</button> <button class="van-button van-button--primary van-button--normal"> </div>
<div class="van-button__content"><span class="van-button__text">展示图片</span></div> <div>
</button></div> <div role="button" tabindex="0" class="van-cell van-cell--clickable">
<div><button class="van-button van-button--primary van-button--normal"> <div class="van-cell__title"><span>自定义图标</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<div class="van-button__content"><span class="van-button__text">动态更新提示</span></div> <!----></i>
</button></div> </div>
<div role="button" tabindex="0" class="van-cell van-cell--clickable">
<div class="van-cell__title"><span>自定义图片</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
<div role="button" tabindex="0" class="van-cell van-cell--clickable">
<div class="van-cell__title"><span>自定义加载图标</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
</div>
<div>
<div role="button" tabindex="0" class="van-cell van-cell--clickable">
<div class="van-cell__title"><span>动态更新提示</span></div><i class="van-icon van-icon-arrow van-cell__right-icon">
<!----></i>
</div>
</div>
</div> </div>
`; `;

14
src/uploader/test/__snapshots__/demo.spec.js.snap
View File

@ -15,7 +15,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/leaf.jpg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/leaf.jpg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon"> <div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon">
@ -23,7 +23,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/tree.jpg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/tree.jpg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon"> <div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon">
@ -39,7 +39,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/leaf.jpg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/leaf.jpg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__mask"> <div class="van-uploader__mask">
@ -49,7 +49,7 @@ exports[`renders demo correctly 1`] = `
</div> </div>
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/tree.jpg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/tree.jpg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__mask"><i class="van-icon van-icon-close van-uploader__mask-icon"> <div class="van-uploader__mask"><i class="van-icon van-icon-close van-uploader__mask-icon">
@ -69,7 +69,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/sand.jpg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/sand.jpg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon"> <div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon">
@ -85,7 +85,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/sand.jpg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/sand.jpg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon"> <div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon">
@ -113,7 +113,7 @@ exports[`renders demo correctly 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/leaf.jpg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/leaf.jpg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
<div class="van-uploader__preview-cover"> <div class="van-uploader__preview-cover">
<div class="preview-cover van-ellipsis">图片名称</div> <div class="preview-cover van-ellipsis">图片名称</div>

16
src/uploader/test/__snapshots__/index.spec.js.snap
View File

@ -23,7 +23,7 @@ exports[`file message should be reactive 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="data:image/test" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="data:image/test" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__mask"> <div class="van-uploader__mask">
@ -42,7 +42,7 @@ exports[`image-fit prop 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: contain;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: contain;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon"> <div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon">
@ -59,7 +59,7 @@ exports[`max-count prop 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="data:image/test" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="data:image/test" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon"> <div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon">
@ -74,7 +74,7 @@ exports[`preview-cover slot 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
<div class="van-uploader__preview-cover">https://img.yzcdn.cn/vant/cat.jpeg</div> <div class="van-uploader__preview-cover">https://img.yzcdn.cn/vant/cat.jpeg</div>
</div> </div>
@ -83,7 +83,7 @@ exports[`preview-cover slot 1`] = `
</div> </div>
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
<div class="van-uploader__preview-cover">https://img.yzcdn.cn/vant/cat.jpeg</div> <div class="van-uploader__preview-cover">https://img.yzcdn.cn/vant/cat.jpeg</div>
</div> </div>
@ -101,7 +101,7 @@ exports[`preview-size prop 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview" style=""> <div class="van-uploader__preview" style="">
<div class="van-image van-uploader__preview-image" style="width: 30px; height: 30px;"><img src="data:image/test" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image" style="width: 30px; height: 30px;"><img src="data:image/test" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon"> <div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon">
@ -118,7 +118,7 @@ exports[`render preview image 1`] = `
<div class="van-uploader__wrapper"> <div class="van-uploader__wrapper">
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="https://img.yzcdn.cn/vant/cat.jpeg" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon"> <div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon">
@ -142,7 +142,7 @@ exports[`render preview image 1`] = `
</div> </div>
<div class="van-uploader__preview"> <div class="van-uploader__preview">
<div class="van-image van-uploader__preview-image"><img src="data:image/test" class="van-image__img" style="object-fit: cover;"> <div class="van-image van-uploader__preview-image"><img src="data:image/test" class="van-image__img" style="object-fit: cover;">
<div class="van-image__loading"><i class="van-icon van-icon-photo-o van-image__loading-icon"> <div class="van-image__loading"><i class="van-icon van-icon-photo van-image__loading-icon">
<!----></i></div> <!----></i></div>
</div> </div>
<div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon"> <div class="van-uploader__preview-delete"><i class="van-icon van-icon-cross van-uploader__preview-delete-icon">

1
types/dialog.d.ts vendored
View File

@ -7,6 +7,7 @@ export type DialogOptions = {
title?: string; title?: string;
width?: string | number; width?: string | number;
message?: string; message?: string;
theme?: string;
overlay?: boolean; overlay?: boolean;
className?: any; className?: any;
allowHtml?: boolean; allowHtml?: boolean;

20
yarn.lock
View File

@ -2121,10 +2121,10 @@
eslint-plugin-import "^2.20.2" eslint-plugin-import "^2.20.2"
eslint-plugin-vue "^6.2.2" eslint-plugin-vue "^6.2.2"
"@vant/icons@1.2.3": "@vant/icons@1.2.5":
version "1.2.3" version "1.2.5"
resolved "https://registry.npmjs.org/@vant/icons/-/icons-1.2.3.tgz#c46b7ddd32363f790944c3af974b73bda80df7a1" resolved "https://registry.npmjs.org/@vant/icons/-/icons-1.2.5.tgz#f3db43c4b300300829e3c4e909beaa33d1cbe786"
integrity sha512-LMu1JGGgZqLYXVFRcuNRDCOWE7AX0vt/gFBkd9xMI7H9uMdNx2oO3YujgNVvVrrF8iufHwfwUv41HiwYMvU3zQ== integrity sha512-PNVSAaAzL3LtWK16qDCtMMfM2A5v+Ie9YTMVHF4QmumpuWxjyk0iUppJ+YRD0MjwR/CTx2OWkIB57+IAqbHnlg==
"@vant/markdown-loader@^3.0.0-alpha.0": "@vant/markdown-loader@^3.0.0-alpha.0":
version "3.0.0-alpha.0" version "3.0.0-alpha.0"
@ -3043,9 +3043,9 @@ bluebird@^3.1.1, bluebird@^3.5.5:
integrity sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg== integrity sha512-XpNj6GDQzdfW+r2Wnn7xiSAd7TM3jzkxGXBGTtWKuSXv1xUV+azxAm8jdWZN06QTQk+2N2XB9jRDkvbmQmcRtg==
bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.1.1, bn.js@^4.4.0: bn.js@^4.0.0, bn.js@^4.1.0, bn.js@^4.1.1, bn.js@^4.4.0:
version "4.11.8" version "4.11.9"
resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.11.8.tgz#2cde09eb5ee341f484746bb0309b3253b1b1442f" resolved "https://registry.yarnpkg.com/bn.js/-/bn.js-4.11.9.tgz#26d556829458f9d1e81fc48952493d0ba3507828"
integrity sha512-ItfYfPLkWHUjckQCk8xC+LwxgK8NYcXywGigJgSwOP8Y2iyWT4f2vsZnoOXTTbo+o5yXmIUJ4gn5538SO5S3gA== integrity sha512-E6QoYqCKZfgatHTdHzs1RRKP7ip4vvm+EyRUeE2RF0NblwVvb0p6jSVeNTOFxPn26QXN2o6SMfNxKp6kU8zQaw==
body-parser@1.19.0: body-parser@1.19.0:
version "1.19.0" version "1.19.0"
@ -4755,9 +4755,9 @@ electron-to-chromium@^1.3.483:
integrity sha512-NReBdOugu1yl8ly+0VDtiQ6Yw/1sLjnvflWq0gvY1nfUXU2PbA+1XAVuEb7ModnwL/MfUPjby7e4pAFnSHiy6Q== integrity sha512-NReBdOugu1yl8ly+0VDtiQ6Yw/1sLjnvflWq0gvY1nfUXU2PbA+1XAVuEb7ModnwL/MfUPjby7e4pAFnSHiy6Q==
elliptic@^6.0.0: elliptic@^6.0.0:
version "6.5.2" version "6.5.3"
resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.2.tgz#05c5678d7173c049d8ca433552224a495d0e3762" resolved "https://registry.yarnpkg.com/elliptic/-/elliptic-6.5.3.tgz#cb59eb2efdaf73a0bd78ccd7015a62ad6e0f93d6"
integrity sha512-f4x70okzZbIQl/NSRLkI/+tteV/9WqL98zx+SQ69KbXxmVrmjwsNUPn/gYJJ0sHvEak24cZgHIPegRePAtA/xw== integrity sha512-IMqzv5wNQf+E6aHeIqATs0tOLeOTwj1QKbRcS3jBbYkl5oLAserA8yJTT7/VyHUYG91PRmPyeQDObKLPpeS4dw==
dependencies: dependencies:
bn.js "^4.4.0" bn.js "^4.4.0"
brorand "^1.0.1" brorand "^1.0.1"