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-10-02 08:50:37 +08:00
commit 1aa1b3d3a5
57 changed files with 500 additions and 270 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -10,6 +10,24 @@ 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.9](https://github.com/youzan/vant/compare/v2.10.8...v2.10.9)
`2020-10-01`
**Feature**
- Locale: Add German translations [#7245](https://github.com/youzan/vant/issues/7245)
- CollapseItem: add toggle method [#7281](https://github.com/youzan/vant/issues/7281)
- Pagination: add page、prev-text、next-text slot [#7222](https://github.com/youzan/vant/issues/7222)
- Tab: skip rendering empty pane [#7238](https://github.com/youzan/vant/issues/7238)
**Bug Fixes**
- Swipe: fix prev、next method types [#7270](https://github.com/youzan/vant/issues/7270)
- Button: incorrect ref in for [#7237](https://github.com/youzan/vant/issues/7237)
- Field: incorrect maxlength slicing [#7284](https://github.com/youzan/vant/issues/7284)
- @vant/markdown-vetur: fix Windows system build vetur problem [#7277](https://github.com/youzan/vant/issues/7277) [#7287](https://github.com/youzan/vant/issues/7287)
### [v2.10.8](https://github.com/youzan/vant/compare/v2.10.7...v2.10.8) ### [v2.10.8](https://github.com/youzan/vant/compare/v2.10.7...v2.10.8)
`2020-09-21` `2020-09-21`

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

@ -10,6 +10,24 @@ Vant 遵循 [Semver](https://semver.org/lang/zh-CN/) 语义化版本规范。
- 次版本号：每隔一至二个月发布，包含新特性和较大的功能更新，向下兼容。 - 次版本号：每隔一至二个月发布，包含新特性和较大的功能更新，向下兼容。
- 主版本号：发布时间不定，包含不兼容更新，预计下一个主版本会与 Vue 3.0 同期发布。 - 主版本号：发布时间不定，包含不兼容更新，预计下一个主版本会与 Vue 3.0 同期发布。
### [v2.10.9](https://github.com/youzan/vant/compare/v2.10.8...v2.10.9)
`2020-10-01`
**Feature**
- Locale: 新增德语语言包 [#7245](https://github.com/youzan/vant/issues/7245)
- CollapseItem: 新增 toggle 方法，用于主动控制面板展开或收起 [#7281](https://github.com/youzan/vant/issues/7281)
- Pagination: 新增 page、prev-text、next-text 插槽 [#7222](https://github.com/youzan/vant/issues/7222)
- Tab: 当标签页内容为空时，不再渲染空的 `van-tab-pane` 节点 [#7238](https://github.com/youzan/vant/issues/7238)
**Bug Fixes**
- Swipe: 修复 prev、next 方法缺少类型定义的问题 [#7270](https://github.com/youzan/vant/issues/7270)
- Button: 修复在 v-for 中渲染时 ref 不正确的问题 [#7237](https://github.com/youzan/vant/issues/7237)
- Field: 修复设置 maxlength 后在中间输入时截断结果不正确的问题 [#7284](https://github.com/youzan/vant/issues/7284)
- @vant/markdown-vetur: 修复 Windows 系统下的兼容问题 [#7277](https://github.com/youzan/vant/issues/7277) [#7287](https://github.com/youzan/vant/issues/7287)
### [v2.10.8](https://github.com/youzan/vant/compare/v2.10.7...v2.10.8) ### [v2.10.8](https://github.com/youzan/vant/compare/v2.10.7...v2.10.8)
`2020-09-21` `2020-09-21`

4
docs/markdown/design.zh-CN.md
View File

@ -2,7 +2,9 @@
### 介绍 ### 介绍
这里提供了 Vant 现有的设计资源，更多资源还在整理中。 Vant 是基于有赞 [Zan Design System](https://design.youzan.com/) 视觉规范实现的组件库，在这里可以下载 Vant 的设计资源。
## 设计稿
### 组件设计稿（Sketch） ### 组件设计稿（Sketch）

5
packages/vant-markdown-vetur/package.json
View File

@ -1,13 +1,14 @@
{ {
"name": "@vant/markdown-vetur", "name": "@vant/markdown-vetur",
"version": "2.0.1", "version": "2.0.2",
"description": "simple parse markdown to vue component description for vetur auto-completion", "description": "simple parse markdown to vue component description for vetur auto-completion",
"main": "lib/index.js", "main": "lib/index.js",
"license": "MIT", "license": "MIT",
"repository": "https://github.com/youzan/vant/tree/dev/packages/vant-markdown-vetur", "repository": "https://github.com/youzan/vant/tree/dev/packages/vant-markdown-vetur",
"author": "zhangshuai", "author": "zhangshuai",
"publishConfig": { "publishConfig": {
"access": "public" "access": "public",
"registry": "https://registry.npmjs.org/"
}, },
"files": [ "files": [
"lib" "lib"

4
packages/vant-markdown-vetur/src/parser.ts
View File

@ -1,6 +1,6 @@
/* eslint-disable no-cond-assign */ /* eslint-disable no-cond-assign */
const TITLE_REG = /^(#+)\s+([^\n]*)/; const TITLE_REG = /^(#+)\s+([^\n]*)/;
const TABLE_REG = /^\|.+\n\|\s*-+/; const TABLE_REG = /^\|.+\r?\n\|\s*-+/;
const TD_REG = /\s*`[^`]+`\s*|([^|`]+)/g; const TD_REG = /\s*`[^`]+`\s*|([^|`]+)/g;
const TABLE_SPLIT_LINE_REG = /^\|\s*-/; const TABLE_SPLIT_LINE_REG = /^\|\s*-/;
@ -27,7 +27,7 @@ function readLine(input: string) {
function splitTableLine(line: string) { function splitTableLine(line: string) {
line = line.replace('\\|', 'JOIN'); line = line.replace('\\|', 'JOIN');
const items = line.split('|').map(item => item.trim().replace('JOIN', '|')); const items = line.split('|').map((item) => item.trim().replace('JOIN', '|'));
// remove pipe character on both sides // remove pipe character on both sides
items.pop(); items.pop();

76
packages/vant-markdown-vetur/yarn.lock
View File

@ -4,7 +4,7 @@
"@nodelib/fs.scandir@2.1.3": "@nodelib/fs.scandir@2.1.3":
version "2.1.3" version "2.1.3"
resolved "http://registry.npm.qima-inc.com/@nodelib/fs.scandir/download/@nodelib/fs.scandir-2.1.3.tgz#3a582bdb53804c6ba6d146579c46e52130cf4a3b" resolved "https://registry.npm.taobao.org/@nodelib/fs.scandir/download/@nodelib/fs.scandir-2.1.3.tgz#3a582bdb53804c6ba6d146579c46e52130cf4a3b"
integrity sha1-Olgr21OATGum0UZXnEblITDPSjs= integrity sha1-Olgr21OATGum0UZXnEblITDPSjs=
dependencies: dependencies:
"@nodelib/fs.stat" "2.0.3" "@nodelib/fs.stat" "2.0.3"
@ -12,45 +12,45 @@
"@nodelib/fs.stat@2.0.3", "@nodelib/fs.stat@^2.0.2": "@nodelib/fs.stat@2.0.3", "@nodelib/fs.stat@^2.0.2":
version "2.0.3" version "2.0.3"
resolved "http://registry.npm.qima-inc.com/@nodelib/fs.stat/download/@nodelib/fs.stat-2.0.3.tgz#34dc5f4cabbc720f4e60f75a747e7ecd6c175bd3" resolved "https://registry.npm.taobao.org/@nodelib/fs.stat/download/@nodelib/fs.stat-2.0.3.tgz#34dc5f4cabbc720f4e60f75a747e7ecd6c175bd3"
integrity sha1-NNxfTKu8cg9OYPdadH5+zWwXW9M= integrity sha1-NNxfTKu8cg9OYPdadH5+zWwXW9M=
"@nodelib/fs.walk@^1.2.3": "@nodelib/fs.walk@^1.2.3":
version "1.2.4" version "1.2.4"
resolved "http://registry.npm.qima-inc.com/@nodelib/fs.walk/download/@nodelib/fs.walk-1.2.4.tgz#011b9202a70a6366e436ca5c065844528ab04976" resolved "https://registry.npm.taobao.org/@nodelib/fs.walk/download/@nodelib/fs.walk-1.2.4.tgz#011b9202a70a6366e436ca5c065844528ab04976"
integrity sha1-ARuSAqcKY2bkNspcBlhEUoqwSXY= integrity sha1-ARuSAqcKY2bkNspcBlhEUoqwSXY=
dependencies: dependencies:
"@nodelib/fs.scandir" "2.1.3" "@nodelib/fs.scandir" "2.1.3"
fastq "^1.6.0" fastq "^1.6.0"
"@types/fs-extra@^8.1.0": "@types/fs-extra@^8.1.0":
version "8.1.0" version "8.1.1"
resolved "http://registry.npm.qima-inc.com/@types/fs-extra/download/@types/fs-extra-8.1.0.tgz#1114834b53c3914806cd03b3304b37b3bd221a4d" resolved "https://registry.npm.taobao.org/@types/fs-extra/download/@types/fs-extra-8.1.1.tgz#1e49f22d09aa46e19b51c0b013cb63d0d923a068"
integrity sha1-ERSDS1PDkUgGzQOzMEs3s70iGk0= integrity sha1-HknyLQmqRuGbUcCwE8tj0NkjoGg=
dependencies: dependencies:
"@types/node" "*" "@types/node" "*"
"@types/node@*": "@types/node@*":
version "13.9.3" version "14.11.2"
resolved "http://registry.npm.qima-inc.com/@types/node/download/@types/node-13.9.3.tgz#6356df2647de9eac569f9a52eda3480fa9e70b4d" resolved "https://registry.npm.taobao.org/@types/node/download/@types/node-14.11.2.tgz?cache=0&sync_timestamp=1600732726474&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40types%2Fnode%2Fdownload%2F%40types%2Fnode-14.11.2.tgz#2de1ed6670439387da1c9f549a2ade2b0a799256"
integrity sha1-Y1bfJkfenqxWn5pS7aNID6nnC00= integrity sha1-LeHtZnBDk4faHJ9UmireKwp5klY=
at-least-node@^1.0.0: at-least-node@^1.0.0:
version "1.0.0" version "1.0.0"
resolved "http://registry.npm.qima-inc.com/at-least-node/download/at-least-node-1.0.0.tgz#602cd4b46e844ad4effc92a8011a3c46e0238dc2" resolved "https://registry.npm.taobao.org/at-least-node/download/at-least-node-1.0.0.tgz#602cd4b46e844ad4effc92a8011a3c46e0238dc2"
integrity sha1-YCzUtG6EStTv/JKoARo8RuAjjcI= integrity sha1-YCzUtG6EStTv/JKoARo8RuAjjcI=
braces@^3.0.1: braces@^3.0.1:
version "3.0.2" version "3.0.2"
resolved "http://registry.npm.qima-inc.com/braces/download/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107" resolved "https://registry.npm.taobao.org/braces/download/braces-3.0.2.tgz#3454e1a462ee8d599e236df336cd9ea4f8afe107"
integrity sha1-NFThpGLujVmeI23zNs2epPiv4Qc= integrity sha1-NFThpGLujVmeI23zNs2epPiv4Qc=
dependencies: dependencies:
fill-range "^7.0.1" fill-range "^7.0.1"
fast-glob@^3.2.2: fast-glob@^3.2.2:
version "3.2.2" version "3.2.4"
resolved "http://registry.npm.qima-inc.com/fast-glob/download/fast-glob-3.2.2.tgz#ade1a9d91148965d4bf7c51f72e1ca662d32e63d" resolved "https://registry.npm.taobao.org/fast-glob/download/fast-glob-3.2.4.tgz#d20aefbf99579383e7f3cc66529158c9b98554d3"
integrity sha1-reGp2RFIll1L98UfcuHKZi0y5j0= integrity sha1-0grvv5lXk4Pn88xmUpFYybmFVNM=
dependencies: dependencies:
"@nodelib/fs.stat" "^2.0.2" "@nodelib/fs.stat" "^2.0.2"
"@nodelib/fs.walk" "^1.2.3" "@nodelib/fs.walk" "^1.2.3"
@ -60,23 +60,23 @@ fast-glob@^3.2.2:
picomatch "^2.2.1" picomatch "^2.2.1"
fastq@^1.6.0: fastq@^1.6.0:
version "1.6.1" version "1.8.0"
resolved "http://registry.npm.qima-inc.com/fastq/download/fastq-1.6.1.tgz#4570c74f2ded173e71cf0beb08ac70bb85826791" resolved "https://registry.npm.taobao.org/fastq/download/fastq-1.8.0.tgz#550e1f9f59bbc65fe185cb6a9b4d95357107f481"
integrity sha1-RXDHTy3tFz5xzwvrCKxwu4WCZ5E= integrity sha1-VQ4fn1m7xl/hhctqm02VNXEH9IE=
dependencies: dependencies:
reusify "^1.0.4" reusify "^1.0.4"
fill-range@^7.0.1: fill-range@^7.0.1:
version "7.0.1" version "7.0.1"
resolved "http://registry.npm.qima-inc.com/fill-range/download/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40" resolved "https://registry.npm.taobao.org/fill-range/download/fill-range-7.0.1.tgz#1919a6a7c75fe38b2c7c77e5198535da9acdda40"
integrity sha1-GRmmp8df44ssfHflGYU12prN2kA= integrity sha1-GRmmp8df44ssfHflGYU12prN2kA=
dependencies: dependencies:
to-regex-range "^5.0.1" to-regex-range "^5.0.1"
fs-extra@^9.0.0: fs-extra@^9.0.0:
version "9.0.0" version "9.0.1"
resolved "http://registry.npm.qima-inc.com/fs-extra/download/fs-extra-9.0.0.tgz#b6afc31036e247b2466dc99c29ae797d5d4580a3" resolved "https://registry.npm.taobao.org/fs-extra/download/fs-extra-9.0.1.tgz?cache=0&sync_timestamp=1592843137563&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ffs-extra%2Fdownload%2Ffs-extra-9.0.1.tgz#910da0062437ba4c39fedd863f1675ccfefcb9fc"
integrity sha1-tq/DEDbiR7JGbcmcKa55fV1FgKM= integrity sha1-kQ2gBiQ3ukw5/t2GPxZ1zP78ufw=
dependencies: dependencies:
at-least-node "^1.0.0" at-least-node "^1.0.0"
graceful-fs "^4.2.0" graceful-fs "^4.2.0"
@ -85,36 +85,36 @@ fs-extra@^9.0.0:
glob-parent@^5.1.0: glob-parent@^5.1.0:
version "5.1.1" version "5.1.1"
resolved "http://registry.npm.qima-inc.com/glob-parent/download/glob-parent-5.1.1.tgz#b6c1ef417c4e5663ea498f1c45afac6916bbc229" resolved "https://registry.npm.taobao.org/glob-parent/download/glob-parent-5.1.1.tgz#b6c1ef417c4e5663ea498f1c45afac6916bbc229"
integrity sha1-tsHvQXxOVmPqSY8cRa+saRa7wik= integrity sha1-tsHvQXxOVmPqSY8cRa+saRa7wik=
dependencies: dependencies:
is-glob "^4.0.1" is-glob "^4.0.1"
graceful-fs@^4.1.6, graceful-fs@^4.2.0: graceful-fs@^4.1.6, graceful-fs@^4.2.0:
version "4.2.3" version "4.2.4"
resolved "http://registry.npm.qima-inc.com/graceful-fs/download/graceful-fs-4.2.3.tgz#4a12ff1b60376ef09862c2093edd908328be8423" resolved "https://registry.npm.taobao.org/graceful-fs/download/graceful-fs-4.2.4.tgz#2256bde14d3632958c465ebc96dc467ca07a29fb"
integrity sha1-ShL/G2A3bvCYYsIJPt2Qgyi+hCM= integrity sha1-Ila94U02MpWMRl68ltxGfKB6Kfs=
is-extglob@^2.1.1: is-extglob@^2.1.1:
version "2.1.1" version "2.1.1"
resolved "http://registry.npm.qima-inc.com/is-extglob/download/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2" resolved "https://registry.npm.taobao.org/is-extglob/download/is-extglob-2.1.1.tgz#a88c02535791f02ed37c76a1b9ea9773c833f8c2"
integrity sha1-qIwCU1eR8C7TfHahueqXc8gz+MI= integrity sha1-qIwCU1eR8C7TfHahueqXc8gz+MI=
is-glob@^4.0.1: is-glob@^4.0.1:
version "4.0.1" version "4.0.1"
resolved "http://registry.npm.qima-inc.com/is-glob/download/is-glob-4.0.1.tgz#7567dbe9f2f5e2467bc77ab83c4a29482407a5dc" resolved "https://registry.npm.taobao.org/is-glob/download/is-glob-4.0.1.tgz#7567dbe9f2f5e2467bc77ab83c4a29482407a5dc"
integrity sha1-dWfb6fL14kZ7x3q4PEopSCQHpdw= integrity sha1-dWfb6fL14kZ7x3q4PEopSCQHpdw=
dependencies: dependencies:
is-extglob "^2.1.1" is-extglob "^2.1.1"
is-number@^7.0.0: is-number@^7.0.0:
version "7.0.0" version "7.0.0"
resolved "http://registry.npm.qima-inc.com/is-number/download/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b" resolved "https://registry.npm.taobao.org/is-number/download/is-number-7.0.0.tgz#7535345b896734d5f80c4d06c50955527a14f12b"
integrity sha1-dTU0W4lnNNX4DE0GxQlVUnoU8Ss= integrity sha1-dTU0W4lnNNX4DE0GxQlVUnoU8Ss=
jsonfile@^6.0.1: jsonfile@^6.0.1:
version "6.0.1" version "6.0.1"
resolved "http://registry.npm.qima-inc.com/jsonfile/download/jsonfile-6.0.1.tgz#98966cba214378c8c84b82e085907b40bf614179" resolved "https://registry.npm.taobao.org/jsonfile/download/jsonfile-6.0.1.tgz#98966cba214378c8c84b82e085907b40bf614179"
integrity sha1-mJZsuiFDeMjIS4LghZB7QL9hQXk= integrity sha1-mJZsuiFDeMjIS4LghZB7QL9hQXk=
dependencies: dependencies:
universalify "^1.0.0" universalify "^1.0.0"
@ -122,13 +122,13 @@ jsonfile@^6.0.1:
graceful-fs "^4.1.6" graceful-fs "^4.1.6"
merge2@^1.3.0: merge2@^1.3.0:
version "1.3.0" version "1.4.1"
resolved "http://registry.npm.qima-inc.com/merge2/download/merge2-1.3.0.tgz#5b366ee83b2f1582c48f87e47cf1a9352103ca81" resolved "https://registry.npm.taobao.org/merge2/download/merge2-1.4.1.tgz#4368892f885e907455a6fd7dc55c0c9d404990ae"
integrity sha1-WzZu6DsvFYLEj4fkfPGpNSEDyoE= integrity sha1-Q2iJL4hekHRVpv19xVwMnUBJkK4=
micromatch@^4.0.2: micromatch@^4.0.2:
version "4.0.2" version "4.0.2"
resolved "http://registry.npm.qima-inc.com/micromatch/download/micromatch-4.0.2.tgz#4fcb0999bf9fbc2fcbdd212f6d629b9a56c39259" resolved "https://registry.npm.taobao.org/micromatch/download/micromatch-4.0.2.tgz#4fcb0999bf9fbc2fcbdd212f6d629b9a56c39259"
integrity sha1-T8sJmb+fvC/L3SEvbWKbmlbDklk= integrity sha1-T8sJmb+fvC/L3SEvbWKbmlbDklk=
dependencies: dependencies:
braces "^3.0.1" braces "^3.0.1"
@ -136,27 +136,27 @@ micromatch@^4.0.2:
picomatch@^2.0.5, picomatch@^2.2.1: picomatch@^2.0.5, picomatch@^2.2.1:
version "2.2.2" version "2.2.2"
resolved "http://registry.npm.qima-inc.com/picomatch/download/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad" resolved "https://registry.npm.taobao.org/picomatch/download/picomatch-2.2.2.tgz#21f333e9b6b8eaff02468f5146ea406d345f4dad"
integrity sha1-IfMz6ba46v8CRo9RRupAbTRfTa0= integrity sha1-IfMz6ba46v8CRo9RRupAbTRfTa0=
reusify@^1.0.4: reusify@^1.0.4:
version "1.0.4" version "1.0.4"
resolved "http://registry.npm.qima-inc.com/reusify/download/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76" resolved "https://registry.npm.taobao.org/reusify/download/reusify-1.0.4.tgz#90da382b1e126efc02146e90845a88db12925d76"
integrity sha1-kNo4Kx4SbvwCFG6QhFqI2xKSXXY= integrity sha1-kNo4Kx4SbvwCFG6QhFqI2xKSXXY=
run-parallel@^1.1.9: run-parallel@^1.1.9:
version "1.1.9" version "1.1.9"
resolved "http://registry.npm.qima-inc.com/run-parallel/download/run-parallel-1.1.9.tgz#c9dd3a7cf9f4b2c4b6244e173a6ed866e61dd679" resolved "https://registry.npm.taobao.org/run-parallel/download/run-parallel-1.1.9.tgz#c9dd3a7cf9f4b2c4b6244e173a6ed866e61dd679"
integrity sha1-yd06fPn0ssS2JE4XOm7YZuYd1nk= integrity sha1-yd06fPn0ssS2JE4XOm7YZuYd1nk=
to-regex-range@^5.0.1: to-regex-range@^5.0.1:
version "5.0.1" version "5.0.1"
resolved "http://registry.npm.qima-inc.com/to-regex-range/download/to-regex-range-5.0.1.tgz#1648c44aae7c8d988a326018ed72f5b4dd0392e4" resolved "https://registry.npm.taobao.org/to-regex-range/download/to-regex-range-5.0.1.tgz#1648c44aae7c8d988a326018ed72f5b4dd0392e4"
integrity sha1-FkjESq58jZiKMmAY7XL1tN0DkuQ= integrity sha1-FkjESq58jZiKMmAY7XL1tN0DkuQ=
dependencies: dependencies:
is-number "^7.0.0" is-number "^7.0.0"
universalify@^1.0.0: universalify@^1.0.0:
version "1.0.0" version "1.0.0"
resolved "http://registry.npm.qima-inc.com/universalify/download/universalify-1.0.0.tgz#b61a1da173e8435b2fe3c67d29b9adf8594bd16d" resolved "https://registry.npm.taobao.org/universalify/download/universalify-1.0.0.tgz#b61a1da173e8435b2fe3c67d29b9adf8594bd16d"
integrity sha1-thodoXPoQ1sv48Z9Kbmt+FlL0W0= integrity sha1-thodoXPoQ1sv48Z9Kbmt+FlL0W0=

2
src/address-edit/README.md
View File

@ -113,7 +113,7 @@ export default {
### Methods ### Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get AddressEdit instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get AddressEdit instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| ---------------- | ------------------ | --------------------- | ------------ | | ---------------- | ------------------ | --------------------- | ------------ |

2
src/address-edit/README.zh-CN.md
View File

@ -113,7 +113,7 @@ export default {
### 方法 ### 方法
通过 ref 可以获取到 AddressEdit 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 AddressEdit 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| ---------------- | ------------ | --------------------- | ------ | | ---------------- | ------------ | --------------------- | ------ |

2
src/area/README.md
View File

@ -90,7 +90,7 @@ To have a selected value，simply pass the `code` of target area to `value` prop
### Methods ### Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get Area instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get Area instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| ----- | ------------------------- | ------------- | ------------ | | ----- | ------------------------- | ------------- | ------------ |

2
src/area/README.zh-CN.md
View File

@ -90,7 +90,7 @@ app.use(Area);
### 方法 ### 方法
通过 ref 可以获取到 Area 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 Area 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |

2
src/calendar/README.md
View File

@ -313,7 +313,7 @@ Following props are supported when the type is multiple
### Methods ### Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get Calendar instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get Calendar instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| ----- | ----------------------------------- | --------- | ------------ | | ----- | ----------------------------------- | --------- | ------------ |

2
src/calendar/README.zh-CN.md
View File

@ -317,7 +317,7 @@ export default {
### 方法 ### 方法
通过 ref 可以获取到 Calendar 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 Calendar 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| ------ | ---------------------- | ---- | ------ | | ------ | ---------------------- | ---- | ------ |

4
src/checkbox/README.md
View File

@ -265,7 +265,7 @@ export default {
### CheckboxGroup Methods ### CheckboxGroup Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get CheckboxGroup instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get CheckboxGroup instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| --- | --- | --- | --- | | --- | --- | --- | --- |
@ -273,7 +273,7 @@ Use [ref](https://vuejs.org/v2/api/#ref) to get CheckboxGroup instance and call
### Checkbox Methods ### Checkbox Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get Checkbox instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get Checkbox instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| ------ | ------------------- | ------------------- | ------------ | | ------ | ------------------- | ------------------- | ------------ |

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

@ -285,7 +285,7 @@ export default {
### CheckboxGroup 方法 ### CheckboxGroup 方法
通过 ref 可以获取到 CheckboxGroup 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 CheckboxGroup 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |
@ -293,7 +293,7 @@ export default {
### Checkbox 方法 ### Checkbox 方法
通过 ref 可以获取到 Checkbox 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 Checkbox 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |

9
src/collapse-item/index.js
View File

@ -5,6 +5,7 @@ import { raf, doubleRaf, createNamespace } from '../utils';
// Composition // Composition
import { useParent } from '@vant/use'; import { useParent } from '@vant/use';
import { useExpose } from '../composition/use-expose';
import { useLazyRender } from '../composition/use-lazy-render'; import { useLazyRender } from '../composition/use-lazy-render';
// Components // Components
@ -82,9 +83,13 @@ export default createComponent({
}); });
}); });
const toggle = (value = !expanded.value) => {
parent.toggle(currentName.value, value);
};
const onClickTitle = () => { const onClickTitle = () => {
if (!props.disabled) { if (!props.disabled) {
parent.toggle(currentName.value, !expanded.value); toggle();
} }
}; };
@ -126,6 +131,8 @@ export default createComponent({
</div> </div>
)); ));
useExpose({ toggle });
return () => ( return () => (
<div class={[bem({ border: index.value && props.border })]}> <div class={[bem({ border: index.value && props.border })]}>
{renderTitle()} {renderTitle()}

8
src/collapse/README.md
View File

@ -127,3 +127,11 @@ export default {
| icon | Custom icon | | icon | Custom icon |
| title | Custom title | | title | Custom title |
| right-icon | Custom right icon | | right-icon | Custom right icon |
### CollapseItem Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get CollapseItem instance and call instance methods.
| Name | Description | Attribute | Return value |
| --- | --- | --- | --- |
| toggle `v2.10.9` | Toggle expanded status | _expanded: boolean_ | - |

26
src/collapse/README.zh-CN.md
View File

@ -1,5 +1,9 @@
# Collapse 折叠面板 # Collapse 折叠面板
### 介绍
将一组内容放置在多个折叠面板中，点击面板的标题可以展开或收缩其内容。
### 引入 ### 引入
```js ```js
@ -118,10 +122,18 @@ export default {
### CollapseItem Slots ### CollapseItem Slots
| 名称 | 说明 | | 名称 | 说明 |
| ---------- | ----------------------------- | | ---------- | ------------------------------ |
| default | 面板内容 | | default | 面板内容 |
| value | 自定义显示内容 | | value | 自定义显示内容 |
| icon | 自定义`icon` | | icon | 自定义 `icon` |
| title | 自定义`title` | | title | 自定义 `title` |
| right-icon | 自定义右侧按钮，默认是`arrow` | | right-icon | 自定义右侧按钮，默认是 `arrow` |
### CollapseItem 方法
通过 ref 可以获取到 CollapseItem 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- |
| toggle `v2.10.9` | 切换面试展开状态，传 `true` 为展开，`false` 为收起，不传参为切换 | _expand?: boolean_ | - |

58
src/collapse/test/index.spec.js
View File

@ -144,3 +144,61 @@ test('warn when value type is incorrect', () => {
expect(error).toHaveBeenCalledTimes(1); expect(error).toHaveBeenCalledTimes(1);
console.error = originConsoleError; console.error = originConsoleError;
}); });
test('toggle method', (done) => {
mount({
template: `
<van-collapse v-model="active" >
<van-collapse-item name="a" ref="a" />
<van-collapse-item name="b" ref="b" />
</van-collapse>
`,
data() {
return { active: [] };
},
mounted() {
this.$refs.a.toggle();
expect(this.active).toEqual(['a']);
this.$refs.b.toggle();
expect(this.active).toEqual(['a', 'b']);
this.$refs.b.toggle(false);
expect(this.active).toEqual(['a']);
this.$refs.a.toggle();
expect(this.active).toEqual([]);
done();
},
});
});
test('toggle method in accordion mode', (done) => {
mount({
template: `
<van-collapse v-model="active" accordion>
<van-collapse-item name="a" ref="a" />
<van-collapse-item name="b" ref="b" />
</van-collapse>
`,
data() {
return { active: '' };
},
mounted() {
this.$refs.a.toggle();
expect(this.active).toEqual('a');
this.$refs.b.toggle();
expect(this.active).toEqual('b');
this.$refs.b.toggle(false);
expect(this.active).toEqual('');
this.$refs.a.toggle();
expect(this.active).toEqual('a');
done();
},
});
});

2
src/count-down/README.md
View File

@ -157,7 +157,7 @@ export default {
### Methods ### Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get CountDown instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get CountDown instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| ----- | ---------------- | --------- | ------------ | | ----- | ---------------- | --------- | ------------ |

2
src/count-down/README.zh-CN.md
View File

@ -167,7 +167,7 @@ export default {
### 方法 ### 方法
通过 ref 可以获取到 CountDown 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 CountDown 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |

2
src/datetime-picker/README.md
View File

@ -295,7 +295,7 @@ Following props are supported when the type is time
### Methods ### Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get DatetimePicker instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get DatetimePicker instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| ------------------ | ------------------- | --------- | ------------ | | ------------------ | ------------------- | --------- | ------------ |

2
src/datetime-picker/README.zh-CN.md
View File

@ -304,7 +304,7 @@ export default {
### 方法 ### 方法
通过 ref 可以获取到 DatetimePicker 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 DatetimePicker 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |

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

@ -164,11 +164,11 @@ Use `active-color` prop to custom active color of the title and options.
### DropdownItem Methods ### DropdownItem Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get DropdownItem instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get DropdownItem instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| ------ | -------------- | ------------- | ------------ | | ------ | -------------- | --------------- | ------------ |
| toggle | Toggle display | show: boolean | - | | toggle | Toggle display | _show: boolean_ | - |
### Data Structure of Option ### Data Structure of Option

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

@ -1,5 +1,9 @@
# DropdownMenu 下拉菜单 # DropdownMenu 下拉菜单
### 介绍
向下弹出的菜单列表。
### 引入 ### 引入
```js ```js
@ -168,11 +172,11 @@ export default {
### DropdownItem 方法 ### DropdownItem 方法
通过 ref 可以获取到 DropdownItem 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 DropdownItem 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |
| toggle | 切换菜单展示状态，传`true`为显示，`false`为隐藏，不传参为取反 | show?: boolean | - | | toggle | 切换菜单展示状态，传 `true` 为显示，`false` 为隐藏，不传参为取反 | _show?: boolean_ | - |
### Option 数据结构 ### Option 数据结构

2
src/field/README.md
View File

@ -271,7 +271,7 @@ Field support all native events of input tag
### Methods ### Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get Field instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get Field instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| ----- | ------------------- | --------- | ------------ | | ----- | ------------------- | --------- | ------------ |

2
src/field/README.zh-CN.md
View File

@ -294,7 +294,7 @@ export default {
### 方法 ### 方法
通过 ref 可以获取到 Field 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 Field 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| ------ | -------------- | ---- | ------ | | ------ | -------------- | ---- | ------ |

11
src/field/index.js
View File

@ -240,10 +240,15 @@ export default createComponent({
const updateValue = (value, trigger = 'onChange') => { const updateValue = (value, trigger = 'onChange') => {
value = isDef(value) ? String(value) : ''; value = isDef(value) ? String(value) : '';
// native maxlength not work when type is number // native maxlength have incorrect line-break counting
const { maxlength } = props; // see: https://github.com/youzan/vant/issues/5033
const { maxlength, modelValue } = props;
if (isDef(maxlength) && value.length > maxlength) { if (isDef(maxlength) && value.length > maxlength) {
value = value.slice(0, maxlength); if (modelValue && modelValue.length === +maxlength) {
value = modelValue;
} else {
value = value.slice(0, maxlength);
}
} }
if (props.type === 'number' || props.type === 'digit') { if (props.type === 'number' || props.type === 'digit') {

12
src/field/test/index.spec.js
View File

@ -171,17 +171,25 @@ test('maxlength', async () => {
value: 1234, value: 1234,
type: 'number', type: 'number',
}, },
listeners: {
input(value) {
wrapper && wrapper.setProps({ value });
},
},
}); });
const input = wrapper.find('input'); const input = wrapper.find('input');
expect(input.element.value).toEqual('123'); expect(input.element.value).toEqual('123');
input.element.value = 1234; input.element.value = 1234;
await later();
input.trigger('input'); input.trigger('input');
expect(input.element.value).toEqual('123'); expect(input.element.value).toEqual('123');
expect(wrapper.emitted('input')[0][0]).toEqual('123'); expect(wrapper.emitted('input')[0][0]).toEqual('123');
// see: https://github.com/youzan/vant/issues/7265
input.element.value = 1423;
input.trigger('input');
expect(input.element.value).toEqual('123');
}); });
test('clearable prop', () => { test('clearable prop', () => {

2
src/form/README.md
View File

@ -467,7 +467,7 @@ export default {
### Methods ### Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get Form instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get Form instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| --- | --- | --- | --- | | --- | --- | --- | --- |

2
src/form/README.zh-CN.md
View File

@ -508,7 +508,7 @@ export default {
### 方法 ### 方法
通过 ref 可以获取到 Form 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 Form 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |

3
src/grid-item/index.less
View File

@ -20,7 +20,8 @@
color: @grid-item-text-color; color: @grid-item-text-color;
font-size: @grid-item-text-font-size; font-size: @grid-item-text-font-size;
line-height: 1.5; line-height: 1.5;
word-wrap: break-word; // https://github.com/youzan/vant/issues/3894
word-break: break-all;
} }
&__icon + &__text { &__icon + &__text {

2
src/list/README.md
View File

@ -163,7 +163,7 @@ export default {
### Methods ### Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get List instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get List instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| ----- | --------------------- | --------- | ------------ | | ----- | --------------------- | --------- | ------------ |

2
src/list/README.zh-CN.md
View File

@ -178,7 +178,7 @@ export default {
### 方法 ### 方法
通过 ref 可以获取到 List 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 List 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |

10
src/locale/README.md
View File

@ -4,18 +4,20 @@
The default language of Vant is Chinese. If you want to use other languages, you can follow the instructions below. The default language of Vant is Chinese. If you want to use other languages, you can follow the instructions below.
## Usage
### Switch languages ### Switch languages
Vant supports multiple languages with the Locale component, and the `Locale.use` method allows you to switch to different languages. Vant supports multiple languages with the Locale component, and the `Locale.use` method allows you to switch to different languages.
```js ```js
import { Locale } from 'vant'; import { Locale } from 'vant';
import enUS from 'vant/lib/locale/lang/en-US'; import enUS from 'vant/es/locale/lang/en-US';
Locale.use('en-US', enUS); Locale.use('en-US', enUS);
``` ```
### Modify default configs ### Override default configs
Use `Locale.add` method to modify the default configs. Use `Locale.add` method to modify the default configs.
@ -52,3 +54,7 @@ Current supported languages:
| Turkish | tr-TR | | Turkish | tr-TR |
> View all language configs [Here](https://github.com/youzan/vant/tree/dev/src/locale/lang). > View all language configs [Here](https://github.com/youzan/vant/tree/dev/src/locale/lang).
### Add new language
If you can’t find the language you need, please send us a Pull Request to add the new language pack, you can refer to [Add German language pack](https://github.com/youzan/vant/pull/7245) PR.

29
src/locale/README.zh-CN.md
View File

@ -2,7 +2,9 @@
### 介绍 ### 介绍
Vant 默认采用中文作为语言，如果需要使用其他语言，可以参考下面的方案。 Vant 采用中文作为默认语言，同时支持多语言切换，请按照下方教程进行国际化设置。
## 使用方法
### 多语言切换 ### 多语言切换
@ -10,12 +12,13 @@ Vant 通过 Locale 组件实现多语言支持，使用 `Locale.use` 方法可
```js ```js
import { Locale } from 'vant'; import { Locale } from 'vant';
import enUS from 'vant/lib/locale/lang/en-US'; // 引入英文语言包
import enUS from 'vant/es/locale/lang/en-US';
Locale.use('en-US', enUS); Locale.use('en-US', enUS);
``` ```
### 修改默认文案 ### 覆盖语言包
通过 `Locale.add` 方法可以实现文案的修改和扩展，示例如下： 通过 `Locale.add` 方法可以实现文案的修改和扩展，示例如下：
@ -33,7 +36,7 @@ const messages = {
Locale.add(messages); Locale.add(messages);
``` ```
### 配置文件 ### 语言包
目前支持的语言: 目前支持的语言:
@ -51,8 +54,22 @@ Locale.add(messages);
| 罗马尼亚语 | ro-RO | | 罗马尼亚语 | ro-RO |
| 挪威语 | nb-NO | | 挪威语 | nb-NO |
> 在 [这里](https://github.com/youzan/vant/tree/dev/src/locale/lang) 查看所有的 i18n 配置文件。 > 在 [这里](https://github.com/youzan/vant/tree/dev/src/locale/lang) 查看所有的语言包源文件。
### Sku 组件 ## 常见问题
### 找不到所需的语言包？
如果上方列表中没有你需要的语言，欢迎给我们提 Pull Request 来增加新的语言包，改动内容可以参考[增加德语语言包](https://github.com/youzan/vant/pull/7245) 的 PR。
### 业务代码如何实现国际化？
可以使用 [vue-i18n](https://github.com/kazupon/vue-i18n) 来实现。
### 以 CDN 形式引入时，如何使用语言包？
目前没有提供 CDN 形式的语言包，可以手动拷贝语言包的内容来使用。
### 语言包中不包含 Sku 组件？
语言包中默认不包含 Sku 业务组件的语言配置，因此如果有 Sku 组件的国际化需求，请自行配置国际化文案。 语言包中默认不包含 Sku 业务组件的语言配置，因此如果有 Sku 组件的国际化需求，请自行配置国际化文案。

2
src/number-keyboard/README.zh-CN.md
View File

@ -2,7 +2,7 @@
### 介绍 ### 介绍
数字虚拟键盘，可以配合[密码输入框组件](#/zh-CN/password-input)或自定义的输入框组件使用。 虚拟数字键盘，可以配合[密码输入框组件](#/zh-CN/password-input)或自定义的输入框组件使用。
### 引入 ### 引入

10
src/pagination/README.md
View File

@ -45,7 +45,7 @@ export default {
/> />
``` ```
### Custom Render ### Custom Button
```html ```html
<van-pagination v-model="currentPage" :total-items="50" :show-page-size="5"> <van-pagination v-model="currentPage" :total-items="50" :show-page-size="5">
@ -83,8 +83,8 @@ export default {
### Slots ### Slots
| Name | Description | Default | | Name | Description | SlotProps |
| --- | --- | --- | | --- | --- | --- |
| prev-text | custom prev slot | `-` | | page `v2.10.9` | Custom pagination item | _{ number: number, text: string, active: boolean }_ |
| next-text | custom next slot | `-` | | prev-text `v2.10.9` | Custom prev text | `-` |
| page | pagination item slot | `{ number: number, text: string, active: boolean }` | | next-text `v2.10.9` | Custom next text | `-` |

18
src/pagination/README.zh-CN.md
View File

@ -14,6 +14,8 @@ app.use(Pagination);
### 基础用法 ### 基础用法
通过 `v-model` 来绑定当前页码。
```html ```html
<van-pagination v-model="currentPage" :total-items="24" :items-per-page="5" /> <van-pagination v-model="currentPage" :total-items="24" :items-per-page="5" />
``` ```
@ -30,12 +32,16 @@ export default {
### 简单模式 ### 简单模式
 将 `mode` 设置为 `simple` 来切换到简单模式，此时分页器不会展示具体的页码按钮。
```html ```html
<van-pagination v-model="currentPage" :page-count="12" mode="simple" /> <van-pagination v-model="currentPage" :page-count="12" mode="simple" />
``` ```
### 显示省略号 ### 显示省略号
设置 `force-ellipses` 后会展示省略号按钮，点击后可以快速跳转。
```html ```html
<van-pagination <van-pagination
v-model="currentPage" v-model="currentPage"
@ -45,7 +51,9 @@ export default {
/> />
``` ```
### 自定义渲染 ### 自定义按钮
通过 `prev-text`、`next-text` 等插槽来自定义分页按钮的内容。
```html ```html
<van-pagination v-model="currentPage" :total-items="50" :show-page-size="5"> <van-pagination v-model="currentPage" :total-items="50" :show-page-size="5">
@ -83,8 +91,8 @@ export default {
### Slots ### Slots
| 名称 | 描述 | 默认值 | | 名称 | 描述 | SlotProps |
| --- | --- | --- | | --- | --- | --- |
| prev-text | 自定义上一页插槽 | `-` | | page `v2.10.9` | 自定义页码 | _{ number: number, text: string, active: boolean }_ |
| next-text | 自定义下一页插槽 | `-` | | prev-text `v2.10.9` | 自定义上一页按钮文字 | `-` |
| page | 自定义页码插槽 | `{ number: number, text: string, active: boolean }` | | next-text `v2.10.9` | 自定义下一页按钮文字 | `-` |

4
src/pagination/demo/index.vue
View File

@ -56,14 +56,14 @@ export default {
'zh-CN': { 'zh-CN': {
title2: '简单模式', title2: '简单模式',
title3: '显示省略号', title3: '显示省略号',
title4: '自定义渲染', title4: '自定义按钮',
prevText: '上一页', prevText: '上一页',
nextText: '下一页', nextText: '下一页',
}, },
'en-US': { 'en-US': {
title2: 'Simple Mode', title2: 'Simple Mode',
title3: 'Show ellipses', title3: 'Show ellipses',
title4: 'Custom Render', title4: 'Custom Button',
prevText: 'Prev', prevText: 'Prev',
nextText: 'Next', nextText: 'Next',
}, },

51
src/password-input/README.md
View File

@ -20,18 +20,14 @@ app.use(NumberKeyboard);
### Basic Usage ### Basic Usage
```html ```html
<!-- PasswordInput -->
<van-password-input <van-password-input
:value="value" :value="value"
info="Some tips"
:focused="showKeyboard" :focused="showKeyboard"
@focus="showKeyboard = true" @focus="showKeyboard = true"
/> />
<!-- NumberKeyboard -->
<van-number-keyboard <van-number-keyboard
v-model="value"
:show="showKeyboard" :show="showKeyboard"
@input="onInput"
@delete="onDelete"
@blur="showKeyboard = false" @blur="showKeyboard = false"
/> />
``` ```
@ -44,30 +40,32 @@ export default {
showKeyboard: true, showKeyboard: true,
}; };
}, },
methods: {
onInput(key) {
this.value = (this.value + key).slice(0, 6);
},
onDelete() {
this.value = this.value.slice(0, this.value.length - 1);
},
},
}; };
``` ```
### Custom length ### Custom Length
```html ```html
<van-password-input <van-password-input
:value="value" :value="value"
:length="4"
:gutter="15" :gutter="15"
:focused="showKeyboard" :focused="showKeyboard"
@focus="showKeyboard = true" @focus="showKeyboard = true"
/> />
``` ```
### Without mask ### Add Gutter
```html
<van-password-input
:value="value"
:gutter="10"
:focused="showKeyboard"
@focus="showKeyboard = true"
/>
```
### Without Mask
```html ```html
<van-password-input <van-password-input
@ -80,22 +78,19 @@ export default {
### Hint Error ### Hint Error
Use `error-info` prop to set error message. For example, a password error is prompted when entering 6 bits. Use `info` to set info message, use `error-info` prop to set error message.
```html ```html
<!-- PasswordInput -->
<van-password-input <van-password-input
:value="value" :value="value"
info="Some tips"
:error-info="errorInfo" :error-info="errorInfo"
:focused="showKeyboard" :focused="showKeyboard"
@focus="showKeyboard = true" @focus="showKeyboard = true"
/> />
<!-- NumberKeyboard -->
<van-number-keyboard <van-number-keyboard
v-model="value"
:show="showKeyboard" :show="showKeyboard"
@input="onInput"
@delete="onDelete"
@blur="showKeyboard = false" @blur="showKeyboard = false"
/> />
``` ```
@ -105,22 +100,18 @@ export default {
data() { data() {
return { return {
value: '123', value: '123',
showKeyboard: true,
errorInfo: '', errorInfo: '',
showKeyboard: true,
}; };
}, },
methods: { watch: {
onInput(key) { value(value) {
this.value = (this.value + key).slice(0, 6); if (value.length === 6 && value !== '123456') {
if (this.value.length === 6) {
this.errorInfo = 'Password Mistake'; this.errorInfo = 'Password Mistake';
} else { } else {
this.errorInfo = ''; this.errorInfo = '';
} }
}, },
onDelete() {
this.value = this.value.slice(0, this.value.length - 1);
},
}, },
}; };
``` ```

56
src/password-input/README.zh-CN.md
View File

@ -2,7 +2,7 @@
### 介绍 ### 介绍
带网格的输入框组件，可以用于输入支付密码、短信验证码等，通常与[数字键盘](#/zh-CN/number-keyboard)组件配合使用。 带网格的输入框组件，可以用于输入密码、短信验证码等场景，通常与[数字键盘](#/zh-CN/number-keyboard)组件配合使用。
### 引入 ### 引入
@ -19,19 +19,19 @@ app.use(NumberKeyboard);
### 基础用法 ### 基础用法
搭配数字键盘组件来实现密码输入功能。
```html ```html
<!-- 密码输入框 --> <!-- 密码输入框 -->
<van-password-input <van-password-input
:value="value" :value="value"
info="密码为 6 位数字"
:focused="showKeyboard" :focused="showKeyboard"
@focus="showKeyboard = true" @focus="showKeyboard = true"
/> />
<!-- 数字键盘 --> <!-- 数字键盘 -->
<van-number-keyboard <van-number-keyboard
v-model="value"
:show="showKeyboard" :show="showKeyboard"
@input="onInput"
@delete="onDelete"
@blur="showKeyboard = false" @blur="showKeyboard = false"
/> />
``` ```
@ -44,24 +44,30 @@ export default {
showKeyboard: true, showKeyboard: true,
}; };
}, },
methods: {
onInput(key) {
this.value = (this.value + key).slice(0, 6);
},
onDelete() {
this.value = this.value.slice(0, this.value.length - 1);
},
},
}; };
``` ```
### 自定义长度 ### 自定义长度
通过 `length` 属性来设置密码长度。
```html ```html
<van-password-input <van-password-input
:value="value" :value="value"
:length="4" :length="4"
:gutter="15" :focused="showKeyboard"
@focus="showKeyboard = true"
/>
```
### 格子间距
通过 `gutter` 属性来设置格子之间的间距。
```html
<van-password-input
:value="value"
:gutter="10"
:focused="showKeyboard" :focused="showKeyboard"
@focus="showKeyboard = true" @focus="showKeyboard = true"
/> />
@ -69,6 +75,8 @@ export default {
### 明文展示 ### 明文展示
将 `mask` 设置为 `false` 可以明文展示输入的内容，适用于短信验证码等场景。
```html ```html
<van-password-input <van-password-input
:value="value" :value="value"
@ -78,23 +86,21 @@ export default {
/> />
``` ```
### 错误提示 ### 提示信息
通过 `error-info` 属性可以设置错误提示信息，例如当输入六位时提示密码错误。 通过 `info` 属性设置提示信息，通过 `error-info` 属性设置错误提示，例如当输入六位时提示密码错误。
```html ```html
<!-- 密码输入框 -->
<van-password-input <van-password-input
:value="value" :value="value"
info="密码为 6 位数字"
:error-info="errorInfo" :error-info="errorInfo"
:focused="showKeyboard" :focused="showKeyboard"
@focus="showKeyboard = true" @focus="showKeyboard = true"
/> />
<!-- 数字键盘 -->
<van-number-keyboard <van-number-keyboard
v-model="value"
:show="showKeyboard" :show="showKeyboard"
@input="onInput"
@delete="onDelete"
@blur="showKeyboard = false" @blur="showKeyboard = false"
/> />
``` ```
@ -104,22 +110,18 @@ export default {
data() { data() {
return { return {
value: '123', value: '123',
showKeyboard: true,
errorInfo: '', errorInfo: '',
showKeyboard: true,
}; };
}, },
methods: { watch: {
onInput(key) { value(value) {
this.value = (this.value + key).slice(0, 6); if (value.length === 6 && value !== '123456') {
if (this.value.length === 6) {
this.errorInfo = '密码错误'; this.errorInfo = '密码错误';
} else { } else {
this.errorInfo = ''; this.errorInfo = '';
} }
}, },
onDelete() {
this.value = this.value.slice(0, this.value.length - 1);
},
}, },
}; };
``` ```

130
src/password-input/demo/index.vue
View File

@ -1,48 +1,56 @@
<template> <template>
<demo-section> <demo-section>
<demo-block :title="t('basicUsage')"> <demo-block ref="basicUsage" :title="t('basicUsage')">
<van-password-input <van-password-input
:value="value1" :value="value.basicUsage"
:info="t('info')" :focused="current === 'basicUsage'"
:focused="keyboard === 'value1'" @focus="current = 'basicUsage'"
@focus="keyboard = 'value1'"
/>
<van-number-keyboard
:show="!!keyboard"
@input="onInput"
@delete="onDelete"
@blur="keyboard = ''"
/> />
</demo-block> </demo-block>
<demo-block :title="t('customLength')"> <demo-block ref="customLength" :title="t('customLength')">
<van-password-input <van-password-input
:value="value2" :value="value.customLength"
:length="4" :length="4"
gutter="15" :focused="current === 'customLength'"
:focused="keyboard === 'value2'" @focus="current = 'customLength'"
@focus="keyboard = 'value2'"
/> />
</demo-block> </demo-block>
<demo-block :title="t('removeMask')"> <demo-block ref="addGutter" :title="t('addGutter')">
<van-password-input
:value="value.addGutter"
:gutter="10"
:focused="current === 'addGutter'"
@focus="current = 'addGutter'"
/>
</demo-block>
<demo-block ref="removeMask" :title="t('removeMask')">
<van-password-input <van-password-input
:value="value3"
:mask="false" :mask="false"
:focused="keyboard === 'value3'" :value="value.removeMask"
@focus="keyboard = 'value3'" :focused="current === 'removeMask'"
@focus="current = 'removeMask'"
/> />
</demo-block> </demo-block>
<demo-block :title="t('hintError')"> <demo-block ref="showInfo" :title="t('showInfo')">
<van-password-input <van-password-input
:value="value4" :info="t('info')"
:value="value.showInfo"
:error-info="errorInfo" :error-info="errorInfo"
:focused="keyboard === 'value4'" :focused="current === 'showInfo'"
@focus="keyboard = 'value4'" @focus="current = 'showInfo'"
/> />
</demo-block> </demo-block>
<van-number-keyboard
:show="!!current"
@blur="current = ''"
@input="onInput"
@delete="onDelete"
/>
</demo-section> </demo-section>
</template> </template>
@ -51,46 +59,76 @@ export default {
i18n: { i18n: {
'zh-CN': { 'zh-CN': {
info: '密码为 6 位数字', info: '密码为 6 位数字',
customLength: '自定义长度', showInfo: '提示信息',
removeMask: '明文展示', addGutter: '格子间距',
hintError: '错误提示',
errorInfo: '密码错误', errorInfo: '密码错误',
removeMask: '明文展示',
customLength: '自定义长度',
}, },
'en-US': { 'en-US': {
info: 'Some tips', info: 'Some tips',
customLength: 'Custom Length', showInfo: 'Show Info',
removeMask: 'Remove Mask', addGutter: 'Add Gutter',
hintError: 'Hint Error',
errorInfo: 'Password Mistake', errorInfo: 'Password Mistake',
removeMask: 'Remove Mask',
customLength: 'Custom Length',
}, },
}, },
data() { data() {
return { return {
value1: '123', value: {
value2: '123', showInfo: '123',
value3: '123', addGutter: '123',
value4: '123', basicUsage: '123',
keyboard: 'value1', removeMask: '123',
customLength: '123',
},
current: 'basicUsage',
errorInfo: '', errorInfo: '',
}; };
}, },
methods: { watch: {
onInput(key) { current(value) {
const { keyboard } = this; if (value) {
this[keyboard] = (this[keyboard] + key).slice(0, 6); const el = this.$refs[value].$el;
if (this[keyboard].length === 6) { const { top } = el.getBoundingClientRect();
this.errorInfo = this.t('errorInfo'); window.scrollTo(0, window.pageYOffset + top);
} else {
this.errorInfo = '';
} }
}, },
},
methods: {
onInput(key) {
const { value, current } = this;
const maxlegnth = current === 'customLength' ? 4 : 6;
const newValue = (value[current] + key).slice(0, maxlegnth);
value[current] = newValue;
if (
current === 'showInfo' &&
newValue.length === 6 &&
newValue !== '123456'
) {
this.errorInfo = this.t('errorInfo');
}
},
onDelete() { onDelete() {
const { keyboard } = this; const { value, current } = this;
this[keyboard] = this[keyboard].slice(0, this[keyboard].length - 1); value[current] = value[current].slice(0, value[current].length - 1);
if (current === 'showInfo') {
this.errorInfo = '';
}
}, },
}, },
}; };
</script> </script>
<style lang="less">
.demo-password-input {
min-height: 140vh;
}
</style>

110
src/password-input/test/__snapshots__/demo.spec.js.snap
View File

@ -14,62 +14,27 @@ exports[`renders demo correctly 1`] = `
<li class="van-hairline--left van-password-input__item"><i style="visibility: hidden;"></i></li> <li class="van-hairline--left van-password-input__item"><i style="visibility: hidden;"></i></li>
<li class="van-hairline--left van-password-input__item"><i style="visibility: hidden;"></i></li> <li class="van-hairline--left van-password-input__item"><i style="visibility: hidden;"></i></li>
</ul> </ul>
<div class="van-password-input__info">密码为 6 位数字</div>
</div> </div>
<div class="van-number-keyboard" name="van-slide-up"> </div>
<div class="van-number-keyboard__body"> <div>
<div class="van-number-keyboard__keys"> <div class="van-password-input">
<div class="van-key__wrapper"> <ul class="van-password-input__security van-hairline--surround">
<div role="button" tabindex="0" class="van-key">1</div> <li class="van-password-input__item"><i style="visibility: visible;"></i></li>
</div> <li class="van-hairline--left van-password-input__item"><i style="visibility: visible;"></i></li>
<div class="van-key__wrapper"> <li class="van-hairline--left van-password-input__item"><i style="visibility: visible;"></i></li>
<div role="button" tabindex="0" class="van-key">2</div> <li class="van-hairline--left van-password-input__item"><i style="visibility: hidden;"></i></li>
</div> </ul>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">3</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">4</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">5</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">6</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">7</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">8</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">9</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key"><svg viewBox="0 0 30 24" xmlns="http://www.w3.org/2000/svg" class="van-key__collapse-icon">
<path d="M25.877 12.843h-1.502c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.5c.187 0 .187 0 .187-.188v-1.511c0-.19 0-.191-.185-.191zM17.999 10.2c0 .188 0 .188.188.188h1.687c.188 0 .188 0 .188-.188V8.688c0-.187.004-.187-.186-.19h-1.69c-.187 0-.187 0-.187.19V10.2zm2.25-3.967h1.5c.188 0 .188 0 .188-.188v-1.7c0-.19 0-.19-.188-.19h-1.5c-.189 0-.189 0-.189.19v1.7c0 .188 0 .188.19.188zm2.063 4.157h3.563c.187 0 .187 0 .187-.189V4.346c0-.19.004-.19-.185-.19h-1.69c-.187 0-.187 0-.187.188v4.155h-1.688c-.187 0-.187 0-.187.189v1.514c0 .19 0 .19.187.19zM14.812 24l2.812-3.4H12l2.813 3.4zm-9-11.157H4.31c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.502c.187 0 .187 0 .187-.188v-1.511c0-.19.01-.191-.189-.191zm15.937 0H8.25c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h13.5c.188 0 .188 0 .188-.188v-1.511c0-.19 0-.191-.188-.191zm-11.438-2.454h1.5c.188 0 .188 0 .188-.188V8.688c0-.187 0-.187-.188-.189h-1.5c-.187 0-.187 0-.187.189V10.2c0 .188 0 .188.187.188zM27.94 0c.563 0 .917.21 1.313.567.518.466.748.757.748 1.51v14.92c0 .567-.188 1.134-.562 1.512-.376.378-.938.566-1.313.566H2.063c-.563 0-.938-.188-1.313-.566-.562-.378-.75-.945-.75-1.511V2.078C0 1.51.188.944.562.567.938.189 1.5 0 1.875 0zm-.062 2H2v14.92h25.877V2zM5.81 4.157c.19 0 .19 0 .19.189v1.762c-.003.126-.024.126-.188.126H4.249c-.126-.003-.126-.023-.126-.188v-1.7c-.187-.19 0-.19.188-.19zm10.5 2.077h1.503c.187 0 .187 0 .187-.188v-1.7c0-.19 0-.19-.187-.19h-1.502c-.188 0-.188.001-.188.19v1.7c0 .188 0 .188.188.188zM7.875 8.5c.187 0 .187.002.187.189V10.2c0 .188 0 .188-.187.188H4.249c-.126-.002-.126-.023-.126-.188V8.625c.003-.126.024-.126.188-.126zm7.875 0c.19.002.19.002.19.189v1.575c-.003.126-.024.126-.19.126h-1.563c-.126-.002-.126-.023-.126-.188V8.625c.002-.126.023-.126.189-.126zm-6-4.342c.187 0 .187 0 .187.189v1.7c0 .188 0 .188-.187.188H8.187c-.126-.003-.126-.023-.126-.188V4.283c.003-.126.024-.126.188-.126zm3.94 0c.185 0 .372 0 .372.189v1.762c-.002.126-.023.126-.187.126h-1.75C12 6.231 12 6.211 12 6.046v-1.7c0-.19.187-.19.187-.19z" fill="currentColor"></path>
</svg></div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">0</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key van-key--delete"><svg viewBox="0 0 32 22" xmlns="http://www.w3.org/2000/svg" class="van-key__delete-icon">
<path d="M28.016 0A3.991 3.991 0 0132 3.987v14.026c0 2.2-1.787 3.987-3.98 3.987H10.382c-.509 0-.996-.206-1.374-.585L.89 13.09C.33 12.62 0 11.84 0 11.006c0-.86.325-1.62.887-2.08L9.01.585A1.936 1.936 0 0110.383 0zm0 1.947H10.368L2.24 10.28c-.224.226-.312.432-.312.73 0 .287.094.51.312.729l8.128 8.333h17.648a2.041 2.041 0 002.037-2.04V3.987c0-1.127-.915-2.04-2.037-2.04zM23.028 6a.96.96 0 01.678.292.95.95 0 01-.003 1.377l-3.342 3.348 3.326 3.333c.189.188.292.43.292.679 0 .248-.103.49-.292.679a.96.96 0 01-.678.292.959.959 0 01-.677-.292L18.99 12.36l-3.343 3.345a.96.96 0 01-.677.292.96.96 0 01-.678-.292.962.962 0 01-.292-.68c0-.248.104-.49.292-.679l3.342-3.348-3.342-3.348A.963.963 0 0114 6.971c0-.248.104-.49.292-.679A.96.96 0 0114.97 6a.96.96 0 01.677.292l3.358 3.348 3.345-3.348A.96.96 0 0123.028 6z" fill="currentColor"></path>
</svg></div>
</div>
</div>
</div>
</div> </div>
</div> </div>
<div> <div>
<div class="van-password-input"> <div class="van-password-input">
<ul class="van-password-input__security"> <ul class="van-password-input__security">
<li class="van-password-input__item"><i style="visibility: visible;"></i></li> <li class="van-password-input__item"><i style="visibility: visible;"></i></li>
<li class="van-password-input__item" style="margin-left: 15px;"><i style="visibility: visible;"></i></li> <li class="van-password-input__item" style="margin-left: 10px;"><i style="visibility: visible;"></i></li>
<li class="van-password-input__item" style="margin-left: 15px;"><i style="visibility: visible;"></i></li> <li class="van-password-input__item" style="margin-left: 10px;"><i style="visibility: visible;"></i></li>
<li class="van-password-input__item" style="margin-left: 15px;"><i style="visibility: hidden;"></i></li> <li class="van-password-input__item" style="margin-left: 10px;"><i style="visibility: hidden;"></i></li>
<li class="van-password-input__item" style="margin-left: 10px;"><i style="visibility: hidden;"></i></li>
<li class="van-password-input__item" style="margin-left: 10px;"><i style="visibility: hidden;"></i></li>
</ul> </ul>
</div> </div>
</div> </div>
@ -95,6 +60,53 @@ exports[`renders demo correctly 1`] = `
<li class="van-hairline--left van-password-input__item"><i style="visibility: hidden;"></i></li> <li class="van-hairline--left van-password-input__item"><i style="visibility: hidden;"></i></li>
<li class="van-hairline--left van-password-input__item"><i style="visibility: hidden;"></i></li> <li class="van-hairline--left van-password-input__item"><i style="visibility: hidden;"></i></li>
</ul> </ul>
<div class="van-password-input__info">密码为 6 位数字</div>
</div>
</div>
<div class="van-number-keyboard" name="van-slide-up">
<div class="van-number-keyboard__body">
<div class="van-number-keyboard__keys">
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">1</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">2</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">3</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">4</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">5</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">6</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">7</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">8</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">9</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key"><svg viewBox="0 0 30 24" xmlns="http://www.w3.org/2000/svg" class="van-key__collapse-icon">
<path d="M25.877 12.843h-1.502c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.5c.187 0 .187 0 .187-.188v-1.511c0-.19 0-.191-.185-.191zM17.999 10.2c0 .188 0 .188.188.188h1.687c.188 0 .188 0 .188-.188V8.688c0-.187.004-.187-.186-.19h-1.69c-.187 0-.187 0-.187.19V10.2zm2.25-3.967h1.5c.188 0 .188 0 .188-.188v-1.7c0-.19 0-.19-.188-.19h-1.5c-.189 0-.189 0-.189.19v1.7c0 .188 0 .188.19.188zm2.063 4.157h3.563c.187 0 .187 0 .187-.189V4.346c0-.19.004-.19-.185-.19h-1.69c-.187 0-.187 0-.187.188v4.155h-1.688c-.187 0-.187 0-.187.189v1.514c0 .19 0 .19.187.19zM14.812 24l2.812-3.4H12l2.813 3.4zm-9-11.157H4.31c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h1.502c.187 0 .187 0 .187-.188v-1.511c0-.19.01-.191-.189-.191zm15.937 0H8.25c-.188 0-.188 0-.188.19v1.512c0 .188 0 .188.188.188h13.5c.188 0 .188 0 .188-.188v-1.511c0-.19 0-.191-.188-.191zm-11.438-2.454h1.5c.188 0 .188 0 .188-.188V8.688c0-.187 0-.187-.188-.189h-1.5c-.187 0-.187 0-.187.189V10.2c0 .188 0 .188.187.188zM27.94 0c.563 0 .917.21 1.313.567.518.466.748.757.748 1.51v14.92c0 .567-.188 1.134-.562 1.512-.376.378-.938.566-1.313.566H2.063c-.563 0-.938-.188-1.313-.566-.562-.378-.75-.945-.75-1.511V2.078C0 1.51.188.944.562.567.938.189 1.5 0 1.875 0zm-.062 2H2v14.92h25.877V2zM5.81 4.157c.19 0 .19 0 .19.189v1.762c-.003.126-.024.126-.188.126H4.249c-.126-.003-.126-.023-.126-.188v-1.7c-.187-.19 0-.19.188-.19zm10.5 2.077h1.503c.187 0 .187 0 .187-.188v-1.7c0-.19 0-.19-.187-.19h-1.502c-.188 0-.188.001-.188.19v1.7c0 .188 0 .188.188.188zM7.875 8.5c.187 0 .187.002.187.189V10.2c0 .188 0 .188-.187.188H4.249c-.126-.002-.126-.023-.126-.188V8.625c.003-.126.024-.126.188-.126zm7.875 0c.19.002.19.002.19.189v1.575c-.003.126-.024.126-.19.126h-1.563c-.126-.002-.126-.023-.126-.188V8.625c.002-.126.023-.126.189-.126zm-6-4.342c.187 0 .187 0 .187.189v1.7c0 .188 0 .188-.187.188H8.187c-.126-.003-.126-.023-.126-.188V4.283c.003-.126.024-.126.188-.126zm3.94 0c.185 0 .372 0 .372.189v1.762c-.002.126-.023.126-.187.126h-1.75C12 6.231 12 6.211 12 6.046v-1.7c0-.19.187-.19.187-.19z" fill="currentColor"></path>
</svg></div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key">0</div>
</div>
<div class="van-key__wrapper">
<div role="button" tabindex="0" class="van-key van-key--delete"><svg viewBox="0 0 32 22" xmlns="http://www.w3.org/2000/svg" class="van-key__delete-icon">
<path d="M28.016 0A3.991 3.991 0 0132 3.987v14.026c0 2.2-1.787 3.987-3.98 3.987H10.382c-.509 0-.996-.206-1.374-.585L.89 13.09C.33 12.62 0 11.84 0 11.006c0-.86.325-1.62.887-2.08L9.01.585A1.936 1.936 0 0110.383 0zm0 1.947H10.368L2.24 10.28c-.224.226-.312.432-.312.73 0 .287.094.51.312.729l8.128 8.333h17.648a2.041 2.041 0 002.037-2.04V3.987c0-1.127-.915-2.04-2.037-2.04zM23.028 6a.96.96 0 01.678.292.95.95 0 01-.003 1.377l-3.342 3.348 3.326 3.333c.189.188.292.43.292.679 0 .248-.103.49-.292.679a.96.96 0 01-.678.292.959.959 0 01-.677-.292L18.99 12.36l-3.343 3.345a.96.96 0 01-.677.292.96.96 0 01-.678-.292.962.962 0 01-.292-.68c0-.248.104-.49.292-.679l3.342-3.348-3.342-3.348A.963.963 0 0114 6.971c0-.248.104-.49.292-.679A.96.96 0 0114.97 6a.96.96 0 01.677.292l3.358 3.348 3.345-3.348A.96.96 0 0123.028 6z" fill="currentColor"></path>
</svg></div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>

2
src/picker/README.md
View File

@ -285,7 +285,7 @@ Picker events will pass different parameters according to the columns are single
### Methods ### Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get Picker instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get Picker instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| --- | --- | --- | --- | | --- | --- | --- | --- |

2
src/picker/README.zh-CN.md
View File

@ -310,7 +310,7 @@ export default {
### 方法 ### 方法
通过 ref 可以获取到 Picker 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 Picker 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |

6
src/picker/index.less
View File

@ -54,7 +54,7 @@
right: 0; right: 0;
bottom: 0; bottom: 0;
left: 0; left: 0;
z-index: 2; z-index: 3;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -67,7 +67,7 @@
top: 50%; top: 50%;
right: @padding-md; right: @padding-md;
left: @padding-md; left: @padding-md;
z-index: 3; z-index: 2;
transform: translateY(-50%); transform: translateY(-50%);
pointer-events: none; pointer-events: none;
} }
@ -76,7 +76,7 @@
position: absolute; position: absolute;
top: 0; top: 0;
left: 0; left: 0;
z-index: 2; z-index: 1;
width: 100%; width: 100%;
height: 100%; height: 100%;
background-image: linear-gradient( background-image: linear-gradient(

2
src/swipe-cell/README.md
View File

@ -132,7 +132,7 @@ export default {
### Methods ### Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get SwipeCell instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get SwipeCell instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| ----- | --------------- | ------------------------ | ------------ | | ----- | --------------- | ------------------------ | ------------ |

6
src/swipe-cell/README.zh-CN.md
View File

@ -1,5 +1,9 @@
# SwipeCell 滑动单元格 # SwipeCell 滑动单元格
### 介绍
可以左右滑动来展示操作按钮的单元格组件。
### 引入 ### 引入
```js ```js
@ -140,7 +144,7 @@ beforeClose 的第一个参数为对象，对象中包含以下属性：
### 方法 ### 方法
通过 ref 可以获取到 SwipeCell 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 SwipeCell 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| ------ | ---------------- | ------------------------ | ------ | | ------ | ---------------- | ------------------------ | ------ |

2
src/swipe/README.md
View File

@ -189,7 +189,7 @@ export default {
### Swipe Methods ### Swipe Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get Swipe instance and call instance methods. Use [ref](https://vuejs.org/v2/api/#ref) to get Swipe instance and call instance methods..
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| --- | --- | --- | --- | | --- | --- | --- | --- |

2
src/swipe/README.zh-CN.md
View File

@ -195,7 +195,7 @@ export default {
### Swipe 方法 ### Swipe 方法
通过 ref 可以获取到 Swipe 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。 通过 ref 可以获取到 Swipe 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |

2
src/tab/README.md
View File

@ -266,7 +266,7 @@ export default {
### Tabs Methods ### Tabs Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get Tabs instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get Tabs instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| --- | --- | --- | --- | | --- | --- | --- | --- |

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

@ -273,7 +273,7 @@ export default {
### Tabs 方法 ### Tabs 方法
通过 ref 可以获取到 Tabs 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 Tabs 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |

2
src/uploader/README.md
View File

@ -254,7 +254,7 @@ Use `disabled` prop to disable uploader.
### Methods ### Methods
Use [ref](https://vuejs.org/v2/api/#ref) to get Uploader instance and call instance methods Use [ref](https://vuejs.org/v2/api/#ref) to get Uploader instance and call instance methods.
| Name | Description | Attribute | Return value | | Name | Description | Attribute | Return value |
| --- | --- | --- | --- | | --- | --- | --- | --- |

2
src/uploader/README.zh-CN.md
View File

@ -282,7 +282,7 @@ before-read、after-read、before-delete 执行时会传递以下回调参数：
### 方法 ### 方法
通过 ref 可以获取到 Uploader 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa) 通过 ref 可以获取到 Uploader 实例并调用实例方法，详见[组件实例方法](#/zh-CN/quickstart#zu-jian-shi-li-fang-fa)。
| 方法名 | 说明 | 参数 | 返回值 | | 方法名 | 说明 | 参数 | 返回值 |
| --- | --- | --- | --- | | --- | --- | --- | --- |

5
types/collapse-item.d.ts vendored Normal file
View File

@ -0,0 +1,5 @@
import { VanComponent } from './component';
export class CollapseItem extends VanComponent {
toggle(expanded?: boolean): void;
}

3
types/index.d.ts vendored
View File

@ -6,6 +6,7 @@ import { Area } from './area';
import { Calendar } from './calendar'; import { Calendar } from './calendar';
import { Checkbox } from './checkbox'; import { Checkbox } from './checkbox';
import { CheckboxGroup } from './checkbox-group'; import { CheckboxGroup } from './checkbox-group';
import { CollapseItem } from './collapse-item';
import { CountDown } from './count-down'; import { CountDown } from './count-down';
import { DatetimePicker } from './datetime-picker'; import { DatetimePicker } from './datetime-picker';
import { Dialog } from './dialog'; import { Dialog } from './dialog';
@ -38,7 +39,6 @@ export class CellGroup extends VanComponent {}
export class Circle extends VanComponent {} export class Circle extends VanComponent {}
export class Col extends VanComponent {} export class Col extends VanComponent {}
export class Collapse extends VanComponent {} export class Collapse extends VanComponent {}
export class CollapseItem extends VanComponent {}
export class ContactCard extends VanComponent {} export class ContactCard extends VanComponent {}
export class ContactEdit extends VanComponent {} export class ContactEdit extends VanComponent {}
export class ContactList extends VanComponent {} export class ContactList extends VanComponent {}
@ -98,6 +98,7 @@ export {
Calendar, Calendar,
Checkbox, Checkbox,
CheckboxGroup, CheckboxGroup,
CollapseItem,
CountDown, CountDown,
DatetimePicker, DatetimePicker,
Dialog, Dialog,

4
types/swipe.d.ts vendored
View File

@ -5,6 +5,10 @@ export type SwipeToOptions = {
}; };
export class Swipe extends VanComponent { export class Swipe extends VanComponent {
prev(): void;
next(): void;
swipeTo(index: number, options?: SwipeToOptions): void; swipeTo(index: number, options?: SwipeToOptions): void;
resize(): void; resize(): void;