From e6a4c695f4aeaffe2bc762bc0d9f7cb7b2a8cd3a Mon Sep 17 00:00:00 2001 From: chenjiahan Date: Sun, 27 Sep 2020 20:07:41 +0800 Subject: [PATCH 1/5] feat(cli): update site style --- README.md | 2 +- README.zh-CN.md | 2 +- docs/markdown/quickstart.zh-CN.md | 8 ++-- .../vant-cli/site/common/style/highlight.less | 5 ++- .../site/desktop/components/Content.vue | 41 +++++++++---------- .../vant-cli/site/desktop/components/Nav.vue | 2 +- .../site/desktop/components/SearchInput.vue | 2 +- .../site/mobile/components/DemoHome.vue | 1 - .../site/mobile/components/DemoHomeNav.vue | 2 +- .../site/mobile/components/DemoNav.vue | 2 +- 10 files changed, 33 insertions(+), 34 deletions(-) diff --git a/README.md b/README.md index ace4aa9d2..47eb27037 100644 --- a/README.md +++ b/README.md @@ -48,7 +48,7 @@ npm i vant -S yarn add vant ``` -> Tips: Please install Vant 3.0 for Vue 3 projects, see [issue#7035](https://github.com/youzan/vant/issues/7035) +> Tips: Please install Vant 3.0 for Vue 3 projects, see [issue#7035](https://github.com/youzan/vant/issues/7035). ## Quickstart diff --git a/README.zh-CN.md b/README.zh-CN.md index 140ef63c9..62b8224f4 100644 --- a/README.zh-CN.md +++ b/README.zh-CN.md @@ -51,7 +51,7 @@ npm i vant -S yarn add vant ``` -> Tips: Vue 3 项目请安装 Vant 3.0,参见 [issue#7035](https://github.com/youzan/vant/issues/7035) +> Tips: Vue 3 项目请安装 Vant 3.0,参见 [issue#7035](https://github.com/youzan/vant/issues/7035)。 ## 快速上手 diff --git a/docs/markdown/quickstart.zh-CN.md b/docs/markdown/quickstart.zh-CN.md index 900e0dfb3..b76abc054 100644 --- a/docs/markdown/quickstart.zh-CN.md +++ b/docs/markdown/quickstart.zh-CN.md @@ -31,7 +31,7 @@ npm i vant -S yarn add vant ``` -> Tips: Vue 3 项目请安装 Vant 3.0,参见 [issue#7035](https://github.com/youzan/vant/issues/7035) +> Tips: Vue 3 项目请安装 Vant 3.0,参见 [issue#7035](https://github.com/youzan/vant/issues/7035)。 ### 示例工程 @@ -85,7 +85,7 @@ module.exports = { import { Button } from 'vant'; ``` -> 如果你在使用 TypeScript,可以使用 [ts-import-plugin](https://github.com/Brooooooklyn/ts-import-plugin) 实现按需引入 +> Tips: 如果你在使用 TypeScript,可以使用 [ts-import-plugin](https://github.com/Brooooooklyn/ts-import-plugin) 实现按需引入。 ### 方式二. 手动按需引入组件 @@ -108,7 +108,7 @@ import 'vant/lib/index.css'; Vue.use(Vant); ``` -> 配置按需引入后,将不允许直接导入所有组件 +> Tips: 配置按需引入后,将不允许直接导入所有组件。 ### 方式四. 通过 CDN 引入 @@ -168,7 +168,7 @@ module.exports = { }; ``` -> 在配置 postcss-loader 时,应避免 ignore node_modules 目录,否则将导致 Vant 样式无法被编译 +> Tips: 在配置 postcss-loader 时,应避免 ignore node_modules 目录,否则将导致 Vant 样式无法被编译。 ### 在桌面端使用 diff --git a/packages/vant-cli/site/common/style/highlight.less b/packages/vant-cli/site/common/style/highlight.less index 07cf774c5..51cafa1d5 100644 --- a/packages/vant-cli/site/common/style/highlight.less +++ b/packages/vant-cli/site/common/style/highlight.less @@ -3,15 +3,18 @@ code { position: relative; display: block; + padding: 16px; overflow-x: auto; color: @van-doc-code-color; font-weight: 400; - font-size: 13.4px; + font-size: 14px; font-family: @van-doc-code-font-family; line-height: 26px; white-space: pre-wrap; word-wrap: break-word; -webkit-font-smoothing: auto; + background-color: #fafafa; + border-radius: 16px; } pre { diff --git a/packages/vant-cli/site/desktop/components/Content.vue b/packages/vant-cli/site/desktop/components/Content.vue index bc5248400..d4b6ecf49 100644 --- a/packages/vant-cli/site/desktop/components/Content.vue +++ b/packages/vant-cli/site/desktop/components/Content.vue @@ -73,30 +73,30 @@ export default { h2 { margin: 45px 0 20px; - font-size: 22px; + font-size: 25px; } h3 { margin-bottom: 16px; - font-weight: 500; + font-weight: 600; font-size: 18px; } h4 { margin: 24px 0 12px; - font-weight: 500; - font-size: 15px; + font-weight: 600; + font-size: 16px; } h5 { margin: 24px 0 12px; - font-weight: 500; - font-size: 14px; + font-weight: 600; + font-size: 15px; } p { color: @van-doc-text-color; - font-size: 14px; + font-size: 15px; line-height: 26px; } @@ -104,13 +104,13 @@ export default { width: 100%; margin-top: 12px; color: @van-doc-text-color; - font-size: 13px; + font-size: 14px; line-height: 1.5; border-collapse: collapse; th { padding: 8px 10px; - font-weight: 500; + font-weight: 600; text-align: left; &:first-child { @@ -134,8 +134,8 @@ export default { margin: 0; padding: 2px 6px; color: @van-doc-blue; - font-weight: 500; - font-size: 10px; + font-weight: 600; + font-size: 11px; background-color: fade(@van-doc-blue, 10%); border-radius: 20px; } @@ -148,7 +148,7 @@ export default { em { color: @van-doc-green; - font-size: 12.5px; + font-size: 14px; font-family: @van-doc-code-font-family; font-style: normal; -webkit-font-smoothing: auto; @@ -161,7 +161,7 @@ export default { margin: 5px 0 5px 10px; padding-left: 15px; color: @van-doc-text-color; - font-size: 14px; + font-size: 15px; line-height: 26px; &::before { @@ -188,12 +188,12 @@ export default { li > code, table code { display: inline; - margin: 2px 3px; + margin: 0 2px; padding: 2px 5px; - font-size: 13px; + font-size: 14px; font-family: inherit; word-break: keep-all; - background-color: #f0f2f5; + background-color: @van-doc-background-color; border-radius: 4px; -webkit-font-smoothing: antialiased; } @@ -208,12 +208,9 @@ export default { } blockquote { - margin: 20px 0 0; + margin: 16px 0 0; padding: 16px; - color: rgba(52, 73, 94, 0.8); - font-weight: 500; - font-size: 14px; - background-color: #ecf9ff; + background-color: #ebfff0; border-radius: @van-doc-border-radius; } @@ -227,7 +224,7 @@ export default { strong { display: block; margin: 24px 0 12px; - font-weight: 500; + font-weight: 600; font-size: 15px; } diff --git a/packages/vant-cli/site/desktop/components/Nav.vue b/packages/vant-cli/site/desktop/components/Nav.vue index 1e3039e6d..6a3028069 100644 --- a/packages/vant-cli/site/desktop/components/Nav.vue +++ b/packages/vant-cli/site/desktop/components/Nav.vue @@ -113,7 +113,7 @@ export default { &__title { padding: 8px 0 8px @van-doc-padding; color: #455a64; - font-weight: 500; + font-weight: 600; font-size: 15px; line-height: 28px; } diff --git a/packages/vant-cli/site/desktop/components/SearchInput.vue b/packages/vant-cli/site/desktop/components/SearchInput.vue index 31b239873..92793710b 100644 --- a/packages/vant-cli/site/desktop/components/SearchInput.vue +++ b/packages/vant-cli/site/desktop/components/SearchInput.vue @@ -83,7 +83,7 @@ export default { } .algolia-docsearch-suggestion--title { - font-weight: 500; + font-weight: 600; } .algolia-docsearch-suggestion--text { diff --git a/packages/vant-cli/site/mobile/components/DemoHome.vue b/packages/vant-cli/site/mobile/components/DemoHome.vue index fbe9c5e52..35bdb7cbe 100644 --- a/packages/vant-cli/site/mobile/components/DemoHome.vue +++ b/packages/vant-cli/site/mobile/components/DemoHome.vue @@ -82,7 +82,6 @@ export default { span { margin-left: 16px; - font-weight: 500; } &--small { diff --git a/packages/vant-cli/site/mobile/components/DemoHomeNav.vue b/packages/vant-cli/site/mobile/components/DemoHomeNav.vue index 2ba2d074d..02d5d28ab 100644 --- a/packages/vant-cli/site/mobile/components/DemoHomeNav.vue +++ b/packages/vant-cli/site/mobile/components/DemoHomeNav.vue @@ -58,7 +58,7 @@ export default { margin: 0 0 12px; padding-left: 20px; color: #323233; - font-weight: 500; + font-weight: 600; font-size: 14px; line-height: 40px; background: #f7f8fa; diff --git a/packages/vant-cli/site/mobile/components/DemoNav.vue b/packages/vant-cli/site/mobile/components/DemoNav.vue index 899d3ee6e..40dc32240 100644 --- a/packages/vant-cli/site/mobile/components/DemoNav.vue +++ b/packages/vant-cli/site/mobile/components/DemoNav.vue @@ -46,7 +46,7 @@ export default { background-color: #fff; &__title { - font-weight: 500; + font-weight: 600; font-size: 17px; text-transform: capitalize; } From 71e68293626ff07e14c59cc2605cae4695e1c4d6 Mon Sep 17 00:00:00 2001 From: chenjiahan Date: Sun, 27 Sep 2020 20:09:31 +0800 Subject: [PATCH 2/5] chore: release @vant/cli@2.6.0 --- packages/vant-cli/package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/vant-cli/package.json b/packages/vant-cli/package.json index 08c6632dd..b3bad2736 100644 --- a/packages/vant-cli/package.json +++ b/packages/vant-cli/package.json @@ -1,6 +1,6 @@ { "name": "@vant/cli", - "version": "2.5.5", + "version": "2.6.0", "description": "", "main": "lib/index.js", "typings": "lib/index.d.ts", From 4f104301198d21a0ec59d3195395075bd1b90f83 Mon Sep 17 00:00:00 2001 From: chenjiahan Date: Sun, 27 Sep 2020 21:01:45 +0800 Subject: [PATCH 3/5] docs(cli): changelog 2.6.0 --- package.json | 2 +- packages/vant-cli/changelog.md | 6 ++++++ yarn.lock | 8 ++++---- 3 files changed, 11 insertions(+), 5 deletions(-) diff --git a/package.json b/package.json index 8760bb0ec..299b457e8 100644 --- a/package.json +++ b/package.json @@ -63,7 +63,7 @@ }, "devDependencies": { "@ls-lint/ls-lint": "^1.8.0", - "@vant/cli": "^2.5.5", + "@vant/cli": "^2.6.0", "prettier": "^2.0.4", "vue": "^2.6.11", "vue-template-compiler": "^2.6.11" diff --git a/packages/vant-cli/changelog.md b/packages/vant-cli/changelog.md index 52f56347d..d35af81aa 100644 --- a/packages/vant-cli/changelog.md +++ b/packages/vant-cli/changelog.md @@ -1,5 +1,11 @@ # 更新日志 +### v2.6.0 + +`2020-09-27` + +- 优化站点样式 + ### v2.5.5 `2020-09-26` diff --git a/yarn.lock b/yarn.lock index 5cd687e4f..22b8dd110 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2000,10 +2000,10 @@ semver "^6.3.0" tsutils "^3.17.1" -"@vant/cli@^2.5.5": - version "2.5.5" - resolved "https://registry.npm.taobao.org/@vant/cli/download/@vant/cli-2.5.5.tgz#15b68b8684d2b4209cde092645556c2abcdd262a" - integrity sha1-FbaLhoTStCCc3gkmRVVsKrzdJio= +"@vant/cli@^2.6.0": + version "2.6.0" + resolved "https://registry.npm.taobao.org/@vant/cli/download/@vant/cli-2.6.0.tgz?cache=0&sync_timestamp=1601208618517&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2F%40vant%2Fcli%2Fdownload%2F%40vant%2Fcli-2.6.0.tgz#e40c195ee303747154d5d2cfca66560dba08d6a8" + integrity sha1-5AwZXuMDdHFU1dLPymZWDboI1qg= dependencies: "@babel/core" "^7.10.1" "@babel/plugin-syntax-jsx" "^7.10.1" From a5dbcf963894a30920a38cf250ba7bdeab365bc2 Mon Sep 17 00:00:00 2001 From: chenjiahan Date: Sun, 27 Sep 2020 21:02:52 +0800 Subject: [PATCH 4/5] docs: add period at the end of sentence --- src/area/README.zh-CN.md | 10 +++++----- src/card/README.zh-CN.md | 4 ++-- src/checkbox/README.md | 2 +- src/checkbox/README.zh-CN.md | 24 ++++++++++++------------ src/circle/README.zh-CN.md | 12 ++++++------ src/col/README.md | 6 +++--- src/col/README.zh-CN.md | 9 ++++----- src/collapse/README.md | 2 +- src/collapse/README.zh-CN.md | 4 ++-- src/divider/README.zh-CN.md | 10 +++++----- src/dropdown-menu/README.md | 2 +- src/dropdown-menu/README.zh-CN.md | 6 +++--- src/empty/README.md | 2 +- src/empty/README.zh-CN.md | 8 ++++---- src/form/README.zh-CN.md | 2 +- src/goods-action/README.md | 2 +- src/goods-action/README.zh-CN.md | 6 +++--- src/grid/README.zh-CN.md | 18 +++++++++--------- src/icon/README.md | 6 +++--- src/icon/README.zh-CN.md | 14 +++++++------- src/image-preview/README.md | 2 +- src/image-preview/README.zh-CN.md | 4 ++-- src/image/README.md | 2 +- src/image/README.zh-CN.md | 14 +++++++------- src/index-bar/README.zh-CN.md | 4 ++-- src/lazyload/README.zh-CN.md | 8 ++++---- src/list/README.zh-CN.md | 6 +++--- src/loading/README.md | 12 +++++++++--- src/loading/README.zh-CN.md | 22 ++++++++++++++-------- src/nav-bar/README.zh-CN.md | 2 +- src/number-keyboard/README.md | 4 ++-- src/number-keyboard/README.zh-CN.md | 14 +++++++------- src/overlay/README.zh-CN.md | 4 ++-- src/panel/README.zh-CN.md | 6 +++--- src/password-input/README.md | 2 +- src/password-input/README.zh-CN.md | 4 ++-- src/picker/README.md | 2 +- src/picker/README.zh-CN.md | 20 ++++++++++---------- src/popup/README.md | 4 ++-- src/popup/README.zh-CN.md | 12 ++++++------ src/progress/README.md | 4 ++-- src/progress/README.zh-CN.md | 8 ++++---- src/pull-refresh/README.md | 2 +- src/pull-refresh/README.zh-CN.md | 4 ++-- src/radio/README.md | 6 +++--- src/radio/README.zh-CN.md | 18 +++++++++--------- src/search/README.zh-CN.md | 2 +- src/skeleton/README.zh-CN.md | 6 +++--- src/slider/README.md | 2 +- src/slider/README.zh-CN.md | 2 +- src/stepper/README.zh-CN.md | 22 +++++++++++----------- src/steps/README.zh-CN.md | 6 +++--- src/sticky/README.zh-CN.md | 6 +++--- src/submit-bar/README.zh-CN.md | 6 +++--- src/swipe-cell/README.zh-CN.md | 6 +++--- src/switch-cell/README.md | 4 ++-- src/switch-cell/README.zh-CN.md | 4 ++-- src/switch/README.zh-CN.md | 12 ++++++------ src/tabbar/README.md | 2 +- src/tabbar/README.zh-CN.md | 10 +++++----- src/toast/README.zh-CN.md | 4 ++-- src/tree-select/README.zh-CN.md | 8 ++++---- src/uploader/README.md | 2 +- src/uploader/README.zh-CN.md | 6 +++--- 64 files changed, 230 insertions(+), 219 deletions(-) diff --git a/src/area/README.zh-CN.md b/src/area/README.zh-CN.md index d207c45ff..60321d4b6 100644 --- a/src/area/README.zh-CN.md +++ b/src/area/README.zh-CN.md @@ -2,7 +2,7 @@ ### 介绍 -省市区三级联动选择,通常与[弹出层](#/zh-CN/popup)组件配合使用 +省市区三级联动选择,通常与[弹出层](#/zh-CN/popup)组件配合使用。 ### 引入 @@ -17,7 +17,7 @@ Vue.use(Area); ### 基础用法 -要初始化一个`Area`组件,你需要传入一个`area-list`属性,数据格式具体可看下面数据格式章节 +要初始化一个 `Area` 组件,你需要传入一个 `area-list` 属性,数据格式具体可看下面数据格式章节。 ```html @@ -25,7 +25,7 @@ Vue.use(Area); ### 选中省市区 -如果想选中某个省市区,需要传入一个`value`属性,绑定对应的省市区`code` +如果想选中某个省市区,需要传入一个 `value` 属性,绑定对应的省市区 `code`。 ```html @@ -33,7 +33,7 @@ Vue.use(Area); ### 配置显示列 -可以通过`columns-num`属性配置省市区显示的列数,默认情况下会显示省市区,当你设置为`2`,则只会显示省市选择 +可以通过 `columns-num` 属性配置省市区显示的列数,默认情况下会显示省市区,当你设置为 `2`,则只会显示省市选择。 ```html @@ -41,7 +41,7 @@ Vue.use(Area); ### 配置列占位提示文字 -可以通过`columns-placeholder`属性配置每一列的占位提示文字 +可以通过 `columns-placeholder` 属性配置每一列的占位提示文字。 ```html diff --git a/src/checkbox/README.zh-CN.md b/src/checkbox/README.zh-CN.md index 4aec14677..539ef31d2 100644 --- a/src/checkbox/README.zh-CN.md +++ b/src/checkbox/README.zh-CN.md @@ -14,7 +14,7 @@ Vue.use(CheckboxGroup); ### 基础用法 -通过`v-model`绑定复选框的勾选状态 +通过 `v-model` 绑定复选框的勾选状态。 ```html 复选框 @@ -32,7 +32,7 @@ export default { ### 禁用状态 -通过设置`disabled`属性可以禁用复选框 +通过设置 `disabled` 属性可以禁用复选框。 ```html 复选框 @@ -40,7 +40,7 @@ export default { ### 自定义形状 -将`shape`属性设置为`square`,复选框的形状会变成方形 +将 `shape` 属性设置为 `square`,复选框的形状会变成方形。 ```html 复选框 @@ -48,7 +48,7 @@ export default { ### 自定义颜色 -通过`checked-color`属性设置选中状态的图标颜色 +通过 `checked-color` 属性设置选中状态的图标颜色。 ```html 复选框 @@ -56,7 +56,7 @@ export default { ### 自定义大小 -通过`icon-size`属性可以自定义图标的大小 +通过 `icon-size` 属性可以自定义图标的大小。 ```html 复选框 @@ -64,7 +64,7 @@ export default { ### 自定义图标 -通过 icon 插槽自定义图标,可以通过`slotProps`判断是否为选中状态 +通过 `icon` 插槽自定义图标,可以通过 `slotProps` 判断是否为选中状态. ```html @@ -95,7 +95,7 @@ export default { ### 禁用文本点击 -设置`label-disabled`属性后,点击图标以外的内容不会触发复选框切换 +设置 `label-disabled` 属性后,点击图标以外的内容不会触发复选框切换。 ```html 复选框 @@ -103,7 +103,7 @@ export default { ### 复选框组 -复选框可以与复选框组一起使用,复选框组通过`v-model`数组绑定复选框的勾选状态 +复选框可以与复选框组一起使用,复选框组通过 `v-model` 数组绑定复选框的勾选状态。 ```html @@ -124,7 +124,7 @@ export default { ### 水平排列 -将`direction`属性设置为`horizontal`后,复选框组会变成水平排列 +将 `direction` 属性设置为 `horizontal` 后,复选框组会变成水平排列。 ```html @@ -145,7 +145,7 @@ export default { ### 限制最大可选数 -通过`max`属性可以限制复选框组的最大可选数 +通过 `max` 属性可以限制复选框组的最大可选数。 ```html @@ -157,7 +157,7 @@ export default { ### 全选与反选 -通过`CheckboxGroup`实例上的`toggleAll`方法可以实现全选与反选 +通过 `CheckboxGroup` 实例上的 `toggleAll` 方法可以实现全选与反选。 ```html @@ -190,7 +190,7 @@ export default { ### 搭配单元格组件使用 -此时你需要再引入`Cell`和`CellGroup`组件,并通过`Checkbox`实例上的 toggle 方法触发切换 +此时你需要再引入 `Cell` 和 `CellGroup` 组件,并通过 `Checkbox` 实例上的 toggle 方法触发切换。 ```html diff --git a/src/circle/README.zh-CN.md b/src/circle/README.zh-CN.md index 39e681824..0d1bebcd3 100644 --- a/src/circle/README.zh-CN.md +++ b/src/circle/README.zh-CN.md @@ -13,7 +13,7 @@ Vue.use(Circle); ### 基础用法 -`rate`属性表示进度条的目标进度,`v-model`表示动画过程中的实时进度。当`rate`发生变化时,`v-model`会以`speed`的速度变化,直至达到`rate`设定的值。 +`rate` 属性表示进度条的目标进度,`v-model` 表示动画过程中的实时进度。当 `rate` 发生变化时,`v-model` 会以 `speed` 的速度变化,直至达到 `rate` 设定的值。 ```html @@ -36,7 +36,7 @@ export default { ### 宽度定制 -通过`stroke-width`属性来控制进度条宽度 +通过 `stroke-width` 属性来控制进度条宽度。 ```html diff --git a/src/col/README.md b/src/col/README.md index d6be11217..28cc21d2b 100644 --- a/src/col/README.md +++ b/src/col/README.md @@ -2,7 +2,7 @@ ### Intro -Quickly and easily create layouts with `van-row` and `van-col` +Quickly and easily create layouts with `van-row` and `van-col`. ### Install @@ -40,7 +40,7 @@ Layout are based on 24-column. The attribute `span` in `Col` means the number of ### Column Spacing -Set grid spacing using `gutter` attribute. The default value is 0 +Set grid spacing using `gutter` attribute. The default value is 0. ```html @@ -52,7 +52,7 @@ Set grid spacing using `gutter` attribute. The default value is 0 ### Flex Layout -Setting `type` to `flex` to enable flex layout +Setting `type` to `flex` to enable flex layout. ```html diff --git a/src/col/README.zh-CN.md b/src/col/README.zh-CN.md index 7eb405993..eba29bda0 100644 --- a/src/col/README.zh-CN.md +++ b/src/col/README.zh-CN.md @@ -2,7 +2,7 @@ ### 介绍 -Layout 提供了`van-row`和`van-col`两个组件来进行行列布局 +Layout 提供了 `van-row` 和 `van-col` 两个组件来进行行列布局。 ### 引入 @@ -18,8 +18,7 @@ Vue.use(Row); ### 基础用法 -Layout 组件提供了`24列栅格`,通过在`Col`上添加`span`属性设置列所占的宽度百分比 -此外,添加`offset`属性可以设置列的偏移宽度,计算方式与 span 相同 +Layout 组件提供了 `24列栅格`,通过在 `Col` 上添加 `span` 属性设置列所占的宽度百分比。此外,添加 `offset` 属性可以设置列的偏移宽度,计算方式与 span 相同。 ```html @@ -40,7 +39,7 @@ Layout 组件提供了`24列栅格`,通过在`Col`上添加`span`属性设置 ### 设置列元素间距 -通过`gutter`属性可以设置列元素之间的间距,默认间距为 0 +通过 `gutter` 属性可以设置列元素之间的间距,默认间距为 0。 ```html @@ -52,7 +51,7 @@ Layout 组件提供了`24列栅格`,通过在`Col`上添加`span`属性设置 ### Flex 布局 -将 `type` 属性设置为 flex 可以启用 flex 布局,便于进行灵活的对齐 +将 `type` 属性设置为 flex 可以启用 flex 布局,便于进行灵活的对齐。 ```html diff --git a/src/collapse/README.md b/src/collapse/README.md index 88d681e39..e72bb1809 100644 --- a/src/collapse/README.md +++ b/src/collapse/README.md @@ -14,7 +14,7 @@ Vue.use(CollapseItem); ### Basic Usage -Use `v-model` to control the name of active panels +Use `v-model` to control the name of active panels. ```html diff --git a/src/collapse/README.zh-CN.md b/src/collapse/README.zh-CN.md index 7931c22c8..f67dc534e 100644 --- a/src/collapse/README.zh-CN.md +++ b/src/collapse/README.zh-CN.md @@ -14,7 +14,7 @@ Vue.use(CollapseItem); ### 基础用法 -通过`v-model`控制展开的面板列表,`activeNames`为数组格式 +通过 `v-model` 控制展开的面板列表,`activeNames` 为数组格式。 ```html @@ -36,7 +36,7 @@ export default { ### 手风琴 -通过`accordion`可以设置为手风琴模式,最多展开一个面板,此时`activeName`为字符串格式 +通过 `accordion` 可以设置为手风琴模式,最多展开一个面板,此时 `activeName` 为字符串格式。 ```html diff --git a/src/divider/README.zh-CN.md b/src/divider/README.zh-CN.md index 0a6b265b1..b8dad665a 100644 --- a/src/divider/README.zh-CN.md +++ b/src/divider/README.zh-CN.md @@ -13,7 +13,7 @@ Vue.use(Divider); ### 基础用法 -默认渲染一条水平分割线 +默认渲染一条水平分割线。 ```html @@ -21,7 +21,7 @@ Vue.use(Divider); ### 展示文字 -通过插槽在可以分割线中间插入内容 +通过插槽在可以分割线中间插入内容。 ```html 文字 @@ -29,7 +29,7 @@ Vue.use(Divider); ### 内容位置 -通过`content-position`指定内容所在位置 +通过 `content-position` 指定内容所在位置。 ```html 文字 @@ -38,7 +38,7 @@ Vue.use(Divider); ### 虚线 -添加`dashed`属性使分割线渲染为虚线 +添加 `dashed` 属性使分割线渲染为虚线。 ```html 文字 @@ -46,7 +46,7 @@ Vue.use(Divider); ### 自定义样式 -可以直接通过`style`属性设置分割线的样式 +可以直接通过 `style` 属性设置分割线的样式。 ```html diff --git a/src/dropdown-menu/README.zh-CN.md b/src/dropdown-menu/README.zh-CN.md index 66056f764..8e4424f3d 100644 --- a/src/dropdown-menu/README.zh-CN.md +++ b/src/dropdown-menu/README.zh-CN.md @@ -44,7 +44,7 @@ export default { ### 自定义菜单内容 -通过插槽可以自定义`DropdownItem`的内容,此时需要使用实例上的`toggle`方法手动控制菜单的显示 +通过插槽可以自定义 `DropdownItem` 的内容,此时需要使用实例上的 `toggle` 方法手动控制菜单的显示。 ```html @@ -93,7 +93,7 @@ export default { ### 自定义选中态颜色 -通过`active-color`属性可以自定义菜单标题和选项的选中态颜色 +通过 `active-color` 属性可以自定义菜单标题和选项的选中态颜色。 ```html @@ -104,7 +104,7 @@ export default { ### 向上展开 -将`direction`属性值设置为`up`,菜单即可向上展开 +将 `direction` 属性值设置为 `up`,菜单即可向上展开。 ```html diff --git a/src/empty/README.md b/src/empty/README.md index 8b13ced49..67ed6fd8e 100644 --- a/src/empty/README.md +++ b/src/empty/README.md @@ -19,7 +19,7 @@ Vue.use(Empty); ### Image Type -Use the image prop to display different placeholder images +Use the image prop to display different placeholder images. ```html diff --git a/src/empty/README.zh-CN.md b/src/empty/README.zh-CN.md index 1b8af0093..df36ec638 100644 --- a/src/empty/README.zh-CN.md +++ b/src/empty/README.zh-CN.md @@ -2,7 +2,7 @@ ### 介绍 -空状态时的占位提示,2.6 版本开始支持此组件 +空状态时的占位提示,2.6 版本开始支持此组件。 ### 引入 @@ -23,7 +23,7 @@ Vue.use(Empty); ### 图片类型 -Empty 组件内置了多种占位图片类型,可以在不同业务场景下使用 +Empty 组件内置了多种占位图片类型,可以在不同业务场景下使用。 ```html @@ -36,7 +36,7 @@ Empty 组件内置了多种占位图片类型,可以在不同业务场景下 ### 自定义图片 -需要自定义图片时,可以在 image 属性中传入任意图片 URL +需要自定义图片时,可以在 image 属性中传入任意图片 URL。 ```html diff --git a/src/form/README.zh-CN.md b/src/form/README.zh-CN.md index 753248e97..da43df78f 100644 --- a/src/form/README.zh-CN.md +++ b/src/form/README.zh-CN.md @@ -2,7 +2,7 @@ ### 介绍 -用于数据录入、校验,支持输入框、单选框、复选框、文件上传等类型,2.5 版本开始支持此组件 +用于数据录入、校验,支持输入框、单选框、复选框、文件上传等类型,2.5 版本开始支持此组件。 ### 引入 diff --git a/src/goods-action/README.md b/src/goods-action/README.md index 1afee9a75..4b4803c36 100644 --- a/src/goods-action/README.md +++ b/src/goods-action/README.md @@ -41,7 +41,7 @@ export default { ### Icon Badge -Use `badge` prop to show badge in icon +Use `badge` prop to show badge in icon. ```html diff --git a/src/goods-action/README.zh-CN.md b/src/goods-action/README.zh-CN.md index 70158c6ee..c6d5f783f 100644 --- a/src/goods-action/README.zh-CN.md +++ b/src/goods-action/README.zh-CN.md @@ -45,7 +45,7 @@ export default { ### 徽标提示 -在 GoodsActionIcon 组件上设置`dot`属性后,会在图标右上角展示一个小红点。设置`badge`属性后,会在图标右上角展示相应的徽标 +在 GoodsActionIcon 组件上设置`dot`属性后,会在图标右上角展示一个小红点。设置`badge`属性后,会在图标右上角展示相应的徽标。 ```html @@ -59,7 +59,7 @@ export default { ### 自定义图标颜色 -通过 GoodsActionIcon 的`color`属性可以自定义图标的颜色 +通过 GoodsActionIcon 的`color`属性可以自定义图标的颜色。 ```html @@ -73,7 +73,7 @@ export default { ### 自定义按钮颜色 -通过 GoodsActionButton 的`color`属性可以自定义按钮的颜色,支持传入`linear-gradient`渐变色 +通过 GoodsActionButton 的 `color` 属性可以自定义按钮的颜色,支持传入 `linear-gradient` 渐变色。 ```html diff --git a/src/grid/README.zh-CN.md b/src/grid/README.zh-CN.md index e1ebcafec..dd342f02d 100644 --- a/src/grid/README.zh-CN.md +++ b/src/grid/README.zh-CN.md @@ -2,7 +2,7 @@ ### 介绍 -宫格可以在水平方向上把页面分隔成等宽度的区块,用于展示内容或进行页面导航 +宫格可以在水平方向上把页面分隔成等宽度的区块,用于展示内容或进行页面导航。 ### 引入 @@ -18,7 +18,7 @@ Vue.use(GridItem); ### 基础用法 -通过`icon`属性设置格子内的图标,`text`属性设置文字内容 +通过 `icon` 属性设置格子内的图标,`text` 属性设置文字内容。 ```html @@ -31,7 +31,7 @@ Vue.use(GridItem); ### 自定义列数 -默认一行展示四个格子,可以通过`column-num`自定义列数 +默认一行展示四个格子,可以通过 `column-num` 自定义列数。 ```html @@ -41,7 +41,7 @@ Vue.use(GridItem); ### 自定义内容 -通过插槽可以自定义格子展示的内容 +通过插槽可以自定义格子展示的内容。 ```html @@ -59,7 +59,7 @@ Vue.use(GridItem); ### 正方形格子 -设置`square`属性后,格子的高度会和宽度保持一致 +设置 `square` 属性后,格子的高度会和宽度保持一致。 ```html @@ -69,7 +69,7 @@ Vue.use(GridItem); ### 格子间距 -通过`gutter`属性设置格子之间的距离 +通过 `gutter` 属性设置格子之间的距离。 ```html @@ -79,7 +79,7 @@ Vue.use(GridItem); ### 内容横排 -将`direction`属性设置为`horizontal`,可以让宫格的内容呈横向排列 +将 `direction` 属性设置为 `horizontal`,可以让宫格的内容呈横向排列。 ```html @@ -91,7 +91,7 @@ Vue.use(GridItem); ### 页面导航 -通过`to`属性设置`vue-router`跳转链接,通过`url`属性设置 URL 跳转链接 +通过 `to` 属性设置 `vue-router` 跳转链接,通过 `url` 属性设置 URL 跳转链接。 ```html @@ -102,7 +102,7 @@ Vue.use(GridItem); ### 徽标提示 -设置`dot`属性后,会在图标右上角展示一个小红点。设置`badge`属性后,会在图标右上角展示相应的徽标 +设置 `dot` 属性后,会在图标右上角展示一个小红点。设置 `badge` 属性后,会在图标右上角展示相应的徽标。 ```html diff --git a/src/icon/README.md b/src/icon/README.md index 94ace825a..4e6f0f7b7 100644 --- a/src/icon/README.md +++ b/src/icon/README.md @@ -13,7 +13,7 @@ Vue.use(Icon); ### Basic Usage -Use `name` prop to set icon name or icon URL +Use `name` prop to set icon name or icon URL. ```html @@ -34,7 +34,7 @@ Use `badge` prop, the badge will be displayed in the upper right corner of the i ### Icon Color -Use `color` prop to set icon color +Use `color` prop to set icon color. ```html @@ -43,7 +43,7 @@ Use `color` prop to set icon color ### Icon Size -Use `size` prop to set icon size +Use `size` prop to set icon size. ```html diff --git a/src/icon/README.zh-CN.md b/src/icon/README.zh-CN.md index 679c1f647..a65d298b5 100644 --- a/src/icon/README.zh-CN.md +++ b/src/icon/README.zh-CN.md @@ -2,7 +2,7 @@ ### 介绍 -基于字体的图标集,可以通过 Icon 组件使用,也可以在其他组件中通过`icon`属性引用 +基于字体的图标集,可以通过 Icon 组件使用,也可以在其他组件中通过 `icon` 属性引用。 ### 引入 @@ -17,7 +17,7 @@ Vue.use(Icon); ### 基础用法 -`Icon`的`name`属性支持传入图标名称或图片链接,所有可用的图标名称见右侧示例 +`Icon` 的 `name` 属性支持传入图标名称或图片链接,所有可用的图标名称见右侧示例。 ```html @@ -26,7 +26,7 @@ Vue.use(Icon); ### 徽标提示 -设置`dot`属性后,会在图标右上角展示一个小红点。设置`badge`属性后,会在图标右上角展示相应的徽标 +设置 `dot` 属性后,会在图标右上角展示一个小红点;设置 `badge` 属性后,会在图标右上角展示相应的徽标。 ```html @@ -36,7 +36,7 @@ Vue.use(Icon); ### 图标颜色 -`Icon`的`color`属性用来设置图标的颜色 +`Icon` 的 `color` 属性用来设置图标的颜色。 ```html @@ -45,7 +45,7 @@ Vue.use(Icon); ### 图标大小 -`Icon`的`size`属性用来设置图标的尺寸大小,默认单位为`px` +`Icon` 的 `size` 属性用来设置图标的尺寸大小,默认单位为 `px`。 ```html @@ -53,7 +53,7 @@ Vue.use(Icon); ### 使用本地字体文件 -Icon 组件默认引用有赞 CDN 提供的字体文件,并通过网络下载。如果需要在项目中使用本地字体文件,请引入下面的 CSS 文件,并在项目中配置`url-loader` +Icon 组件默认引用有赞 CDN 提供的字体文件,并通过网络下载。如果需要在项目中使用本地字体文件,请引入下面的 CSS 文件,并在项目中配置 `url-loader`。 ```js import 'vant/lib/icon/local.css'; @@ -61,7 +61,7 @@ import 'vant/lib/icon/local.css'; ### 自定义图标 -如果需要在现有 Icon 的基础上使用更多图标,可以引入第三方 iconfont 对应的字体文件和 CSS 文件,之后就可以在 Icon 组件中直接使用 +如果需要在现有 Icon 的基础上使用更多图标,可以引入第三方 iconfont 对应的字体文件和 CSS 文件,之后就可以在 Icon 组件中直接使用。 ```css /* 引入第三方或自定义的字体图标样式 */ diff --git a/src/image-preview/README.md b/src/image-preview/README.md index de328ca73..3fb4392cb 100644 --- a/src/image-preview/README.md +++ b/src/image-preview/README.md @@ -34,7 +34,7 @@ ImagePreview({ ### Show Close Icon -After setting the `closeable` attribute, the close icon will be displayed in the upper right corner of the pop-up layer, and the icon can be customized through the `close-icon` attribute, and the icon location can be customized by using the `close-icon-position` attribute +After setting the `closeable` attribute, the close icon will be displayed in the upper right corner of the pop-up layer, and the icon can be customized through the `close-icon` attribute, and the icon location can be customized by using the `close-icon-position` attribute. ```js ImagePreview({ diff --git a/src/image-preview/README.zh-CN.md b/src/image-preview/README.zh-CN.md index 2ed7fb416..4b6f52420 100644 --- a/src/image-preview/README.zh-CN.md +++ b/src/image-preview/README.zh-CN.md @@ -62,7 +62,7 @@ ImagePreview({ ### 展示关闭按钮 -设置`closeable`属性后,会在弹出层的右上角显示关闭图标,并且可以通过`close-icon`属性自定义图标,使用`close-icon-position`属性可以自定义图标位置。 +设置 `closeable` 属性后,会在弹出层的右上角显示关闭图标,并且可以通过 `close-icon` 属性自定义图标,使用`close-icon-position` 属性可以自定义图标位置。 ```js ImagePreview({ @@ -94,7 +94,7 @@ ImagePreview({ ### 异步关闭 -通过`asyncClose`属性可以开启异步关闭,开启后异步关闭后,只能通过实例上的 close 方法关闭图片预览。 +通过 `asyncClose` 属性可以开启异步关闭,开启后异步关闭后,只能通过实例上的 close 方法关闭图片预览。 ```js const instance = ImagePreview({ diff --git a/src/image/README.md b/src/image/README.md index beb6c10b7..83ea8f509 100644 --- a/src/image/README.md +++ b/src/image/README.md @@ -30,7 +30,7 @@ Vue.use(VanImage); ### Round -Show round image, it may not works at `fit=contain` and `fit=scale-down` +Show round image, it may not works at `fit=contain` and `fit=scale-down`. ```html @@ -25,7 +25,7 @@ Vue.use(VanImage); ### 填充模式 -通过`fit`属性可以设置图片填充模式,可选值见下方表格 +通过 `fit` 属性可以设置图片填充模式,可选值见下方表格。 ```html @@ -83,7 +83,7 @@ Vue.use(Lazyload); ### 加载失败提示 -`Image`组件提供了默认的加载失败提示,支持通过`error`插槽自定义内容 +`Image` 组件提供了默认的加载失败提示,支持通过 `error` 插槽自定义内容。 ```html diff --git a/src/index-bar/README.zh-CN.md b/src/index-bar/README.zh-CN.md index 9d5b63479..d2133f05b 100644 --- a/src/index-bar/README.zh-CN.md +++ b/src/index-bar/README.zh-CN.md @@ -14,7 +14,7 @@ Vue.use(IndexAnchor); ### 基础用法 -点击索引栏时,会自动跳转到对应的`IndexAnchor`锚点位置 +点击索引栏时,会自动跳转到对应的 `IndexAnchor` 锚点位置。 ```html @@ -34,7 +34,7 @@ Vue.use(IndexAnchor); ### 自定义索引列表 -可以通过`index-list`属性自定义展示的索引字符列表, +可以通过 `index-list` 属性自定义展示的索引字符列表。 ```html diff --git a/src/lazyload/README.zh-CN.md b/src/lazyload/README.zh-CN.md index 4699684fb..7853edb9b 100644 --- a/src/lazyload/README.zh-CN.md +++ b/src/lazyload/README.zh-CN.md @@ -2,7 +2,7 @@ ### 引入 -`Lazyload` 是 `Vue` 指令,使用前需要对指令进行注册 +`Lazyload` 是 `Vue` 指令,使用前需要对指令进行注册。 ```js import Vue from 'vue'; @@ -20,7 +20,7 @@ Vue.use(Lazyload, { ### 基础用法 -将`v-lazy`指令的值设置为你需要懒加载的图片 +将 `v-lazy` 指令的值设置为你需要懒加载的图片。 ```html @@ -41,7 +41,7 @@ export default { ### 背景图懒加载 -和图片懒加载不同,背景图懒加载需要使用`v-lazy:background-image`,值设置为背景图片的地址,需要注意的是必须声明容器高度。 +和图片懒加载不同,背景图懒加载需要使用 `v-lazy:background-image`,值设置为背景图片的地址,需要注意的是必须声明容器高度。 ```html
@@ -49,7 +49,7 @@ export default { ### 组件懒加载 -将需要懒加载的组件放在`lazy-component`标签中,即可实现组件懒加载。 +将需要懒加载的组件放在 `lazy-component` 标签中,即可实现组件懒加载。 ```js // 注册时设置`lazyComponent`选项 diff --git a/src/list/README.zh-CN.md b/src/list/README.zh-CN.md index ba1a0fe77..bb1165031 100644 --- a/src/list/README.zh-CN.md +++ b/src/list/README.zh-CN.md @@ -17,7 +17,7 @@ Vue.use(List); ### 基础用法 -List 组件通过`loading`和`finished`两个变量控制加载状态,当组件滚动到底部时,会触发`load`事件并将`loading`设置成`true`。此时可以发起异步操作并更新数据,数据更新完毕后,将`loading`设置成`false`即可。若数据已全部加载完毕,则直接将`finished`设置成`true`即可。 +List 组件通过 `loading` 和 `finished` 两个变量控制加载状态,当组件滚动到底部时,会触发 `load` 事件并将 `loading` 设置成 `true`。此时可以发起异步操作并更新数据,数据更新完毕后,将 `loading` 设置成 `false` 即可。若数据已全部加载完毕,则直接将 `finished` 设置成 `true` 即可。 ```html diff --git a/src/loading/README.md b/src/loading/README.md index 0f040966f..51f9ca7e5 100644 --- a/src/loading/README.md +++ b/src/loading/README.md @@ -14,19 +14,25 @@ Vue.use(Loading); ### Type ```html - + + + ``` ### Color ```html - + + + ``` ### Size ```html - + + + ``` ### Text diff --git a/src/loading/README.zh-CN.md b/src/loading/README.zh-CN.md index 9531f5ddf..08cba192b 100644 --- a/src/loading/README.zh-CN.md +++ b/src/loading/README.zh-CN.md @@ -13,31 +13,37 @@ Vue.use(Loading); ### 加载类型 -通过`type`属性可以设置加载图标的类型,默认为`circular`,可选值为`spinner` +通过 `type` 属性可以设置加载图标的类型,默认为 `circular`,可选值为 `spinner`。 ```html - + + + ``` ### 自定义颜色 -通过`color`属性设置加载图标的颜色 +通过 `color` 属性设置加载图标的颜色。 ```html - + + + ``` ### 自定义大小 -通过`size`属性设置加载图标的大小,默认单位为`px` +通过 `size` 属性设置加载图标的大小,默认单位为 `px`。 ```html - + + + ``` ### 加载文案 -可以使用默认插槽在图标的右侧插入加载文案 +可以使用默认插槽在图标的右侧插入加载文案。 ```html 加载中... @@ -45,7 +51,7 @@ Vue.use(Loading); ### 垂直排列 -设置`vertical`属性后,图标和文案会垂直排列 +设置 `vertical` 属性后,图标和文案会垂直排列。 ```html 加载中... diff --git a/src/nav-bar/README.zh-CN.md b/src/nav-bar/README.zh-CN.md index 100999759..104f7022d 100644 --- a/src/nav-bar/README.zh-CN.md +++ b/src/nav-bar/README.zh-CN.md @@ -41,7 +41,7 @@ export default { ### 使用插槽 -通过插槽自定义导航栏两侧的内容 +通过插槽自定义导航栏两侧的内容。 ```html diff --git a/src/number-keyboard/README.md b/src/number-keyboard/README.md index aa7d3a48a..73456df9d 100644 --- a/src/number-keyboard/README.md +++ b/src/number-keyboard/README.md @@ -61,7 +61,7 @@ export default { ### IdNumber Keyboard -Use `extra-key` prop to set the content of bottom left button +Use `extra-key` prop to set the content of bottom left button. ```html @@ -80,7 +80,7 @@ Use `extra-key` prop to set the content of bottom left button ### Keyboard With Title -Use `title` prop to set keyboard title +Use `title` prop to set keyboard title. ```html diff --git a/src/number-keyboard/README.zh-CN.md b/src/number-keyboard/README.zh-CN.md index dab5c5b5d..99392b922 100644 --- a/src/number-keyboard/README.zh-CN.md +++ b/src/number-keyboard/README.zh-CN.md @@ -2,7 +2,7 @@ ### 介绍 -数字虚拟键盘,可以配合[密码输入框组件](#/zh-CN/password-input)或自定义的输入框组件使用 +数字虚拟键盘,可以配合[密码输入框组件](#/zh-CN/password-input)或自定义的输入框组件使用。 ### 引入 @@ -17,7 +17,7 @@ Vue.use(NumberKeyboard); ### 默认样式 -数字键盘提供了 `input`、`delete`、`blur` 事件,分别对应输入内容、删除内容和失去焦点的动作 +数字键盘提供了 `input`、`delete`、`blur` 事件,分别对应输入内容、删除内容和失去焦点的动作。 ```html @@ -55,7 +55,7 @@ export default { ### 带右侧栏的键盘 -将 theme 属性设置为 `custom` 来展示键盘的右侧栏,常用于输入金额的场景 +将 theme 属性设置为 `custom` 来展示键盘的右侧栏,常用于输入金额的场景。 ```html @@ -89,7 +89,7 @@ export default { ### 键盘标题 -通过 `title` 属性可以设置键盘标题 +通过 `title` 属性可以设置键盘标题。 ```html @@ -108,7 +108,7 @@ export default { ### 配置多个按键 -当 theme 为 `custom` 时,支持以数组的形式配置两个 `extra-key` +当 theme 为 `custom` 时,支持以数组的形式配置两个 `extra-key`。 ```html @@ -126,7 +126,7 @@ export default { ### 双向绑定 -可以通过 `v-model` 绑定键盘当前输入值 +可以通过 `v-model` 绑定键盘当前输入值。 ```html diff --git a/src/panel/README.zh-CN.md b/src/panel/README.zh-CN.md index 77d6d9ba8..f889e01c9 100644 --- a/src/panel/README.zh-CN.md +++ b/src/panel/README.zh-CN.md @@ -2,7 +2,7 @@ ### 废弃提示 -由于使用场景有限,Panel 组件将在 3.0 版本中废弃,请直接使用 Cell 和 Button 组件代替 +由于使用场景有限,Panel 组件将在 3.0 版本中废弃,请直接使用 Cell 和 Button 组件代替。 ### 引入 @@ -17,7 +17,7 @@ Vue.use(Panel); ### 基础用法 -面板只是一个容器,里面可以放入自定义的内容 +面板只是一个容器,里面可以放入自定义的内容。 ```html @@ -27,7 +27,7 @@ Vue.use(Panel); ### 高级用法 -使用`slot`自定义内容 +使用插槽自定义内容。 ```html diff --git a/src/password-input/README.md b/src/password-input/README.md index 6bc5f0f79..cc91d5136 100644 --- a/src/password-input/README.md +++ b/src/password-input/README.md @@ -79,7 +79,7 @@ export default { ### Hint Error -Use `error-info` prop to set error message. For example, a password error is prompted when entering 6 bits +Use `error-info` prop to set error message. For example, a password error is prompted when entering 6 bits. ```html diff --git a/src/password-input/README.zh-CN.md b/src/password-input/README.zh-CN.md index a02c2d535..fdc6e3d51 100644 --- a/src/password-input/README.zh-CN.md +++ b/src/password-input/README.zh-CN.md @@ -2,7 +2,7 @@ ### 介绍 -带网格的输入框组件,可以用于输入支付密码、短信验证码等,通常与[数字键盘](#/zh-CN/number-keyboard)组件配合使用 +带网格的输入框组件,可以用于输入支付密码、短信验证码等,通常与[数字键盘](#/zh-CN/number-keyboard)组件配合使用。 ### 引入 @@ -79,7 +79,7 @@ export default { ### 错误提示 -通过`error-info`属性可以设置错误提示信息,例如当输入六位时提示密码错误 +通过 `error-info` 属性可以设置错误提示信息,例如当输入六位时提示密码错误。 ```html diff --git a/src/picker/README.md b/src/picker/README.md index 1f4f0cdae..f25ea24fc 100644 --- a/src/picker/README.md +++ b/src/picker/README.md @@ -173,7 +173,7 @@ export default { ### Loading -When Picker columns data is acquired asynchronously, use `loading` prop to show loading prompt +When Picker columns data is acquired asynchronously, use `loading` prop to show loading prompt. ```html diff --git a/src/picker/README.zh-CN.md b/src/picker/README.zh-CN.md index 37034781f..22bcf5e29 100644 --- a/src/picker/README.zh-CN.md +++ b/src/picker/README.zh-CN.md @@ -2,7 +2,7 @@ ### 介绍 -提供多个选项集合供用户选择,支持单列选择和多列级联,通常与[弹出层](#/zh-CN/popup)组件配合使用 +提供多个选项集合供用户选择,支持单列选择和多列级联,通常与[弹出层](#/zh-CN/popup)组件配合使用。 ### 引入 @@ -19,11 +19,11 @@ Vue.use(Picker); #### 选项配置 -Picker 组件通过`columns`属性配置选项数据,`columns`是一个包含字符串或对象的数组。 +Picker 组件通过 `columns` 属性配置选项数据,`columns` 是一个包含字符串或对象的数组。 #### 顶部栏 -设置`show-toolbar`属性后会展示顶部操作栏,顶部栏包含标题、确认按钮和取消按钮,点击确认按钮触发`confirm`事件,点击取消按钮触发`cancel`事件 +设置 `show-toolbar` 属性后会展示顶部操作栏,顶部栏包含标题、确认按钮和取消按钮,点击确认按钮触发 `confirm` 事件,点击取消按钮触发 `cancel` 事件。 ```html @@ -69,7 +69,7 @@ export default { ### 多列选择 -`columns`属性可以通过对象数组的形式配置多列选择,对象中可以配置选项数据、初始选中项等,详细格式见[下方表格](#/zh-CN/picker#column-shu-ju-jie-gou)。 +`columns` 属性可以通过对象数组的形式配置多列选择,对象中可以配置选项数据、初始选中项等,详细格式见[下方表格](#/zh-CN/picker#column-shu-ju-jie-gou)。 ```html @@ -98,7 +98,7 @@ export default { ### 级联选择 -使用`columns`的`children`字段可以实现选项级联的效果(从 2.4.5 版本开始支持) +使用 `columns` 的 `children` 字段可以实现选项级联的效果(从 2.4.5 版本开始支持)。 ```html @@ -145,7 +145,7 @@ export default { ### 禁用选项 -选项可以为对象结构,通过设置 disabled 来禁用该选项 +选项可以为对象结构,通过设置 `disabled` 来禁用该选项。 ```html @@ -167,7 +167,7 @@ export default { ### 动态设置选项 -通过 Picker 上的实例方法可以更灵活地控制选择器,比如使用`setColumnValues`方法实现多列联动 +通过 Picker 上的实例方法可以更灵活地控制选择器,比如使用 `setColumnValues` 方法实现多列联动。 ```html @@ -195,7 +195,7 @@ export default { ### 加载状态 -若选择器数据是异步获取的,可以通过 `loading` 属性显示加载提示 +若选择器数据是异步获取的,可以通过 `loading` 属性显示加载提示。 ```html @@ -220,7 +220,7 @@ export default { ### 搭配弹出层使用 -在实际场景中,Picker 通常作为用于辅助表单填写,可以搭配 Popup 和 Field 实现该效果 +在实际场景中,Picker 通常作为用于辅助表单填写,可以搭配 Popup 和 Field 实现该效果。 ```html @@ -77,7 +77,7 @@ Use `position` prop to set popup display position ### Get Container -Use `get-container` prop to specify mount location +Use `get-container` prop to specify mount location. ```html diff --git a/src/popup/README.zh-CN.md b/src/popup/README.zh-CN.md index 445fc9dc6..877ab20f8 100644 --- a/src/popup/README.zh-CN.md +++ b/src/popup/README.zh-CN.md @@ -2,7 +2,7 @@ ### 介绍 -弹出层容器,用于展示弹窗、信息提示等内容,支持多个弹出层叠加展示 +弹出层容器,用于展示弹窗、信息提示等内容,支持多个弹出层叠加展示。 ### 引入 @@ -17,7 +17,7 @@ Vue.use(Popup); ### 基础用法 -通过`v-model`控制弹出层是否展示 +通过 `v-model` 控制弹出层是否展示。 ```html 展示弹出层 @@ -42,7 +42,7 @@ export default { ### 弹出位置 -通过`position`属性设置弹出位置,默认居中弹出,可以设置为`top`、`bottom`、`left`、`right` +通过 `position` 属性设置弹出位置,默认居中弹出,可以设置为 `top`、`bottom`、`left`、`right`。 ```html @@ -50,7 +50,7 @@ export default { ### 关闭图标 -设置`closeable`属性后,会在弹出层的右上角显示关闭图标,并且可以通过`close-icon`属性自定义图标,使用`close-icon-position`属性可以自定义图标位置 +设置 `closeable` 属性后,会在弹出层的右上角显示关闭图标,并且可以通过 `close-icon` 属性自定义图标,使用 `close-icon-position` 属性可以自定义图标位置。 ```html @@ -87,7 +87,7 @@ export default { ### 指定挂载位置 -弹出层默认挂载到组件所在位置,可以通过`get-container`属性指定挂载位置 +弹出层默认挂载到组件所在位置,可以通过 `get-container` 属性指定挂载位置。 ```html diff --git a/src/progress/README.md b/src/progress/README.md index 92bea54f4..b7bd30132 100644 --- a/src/progress/README.md +++ b/src/progress/README.md @@ -13,7 +13,7 @@ Vue.use(Progress); ### Basic Usage -Use 'percentage' prop to set current progress +Use `percentage` prop to set current progress. ```html @@ -33,7 +33,7 @@ Use 'percentage' prop to set current progress ### Custom Style -Use `pivot-text` to custom text,use `color` to custom bar color +Use `pivot-text` to custom text,use `color` to custom bar color. ```html diff --git a/src/progress/README.zh-CN.md b/src/progress/README.zh-CN.md index 0ac68b5be..28f3fa00b 100644 --- a/src/progress/README.zh-CN.md +++ b/src/progress/README.zh-CN.md @@ -13,7 +13,7 @@ Vue.use(Progress); ### 基础用法 -进度条默认为蓝色,使用`percentage`属性来设置当前进度 +进度条默认为蓝色,使用 `percentage` 属性来设置当前进度。 ```html @@ -21,7 +21,7 @@ Vue.use(Progress); ### 线条粗细 -通过`stroke-width`可以设置进度条的粗细 +通过 `stroke-width` 可以设置进度条的粗细。 ```html @@ -29,7 +29,7 @@ Vue.use(Progress); ### 置灰 -设置`inactive`属性后进度条将置灰 +设置 `inactive` 属性后进度条将置灰。 ```html @@ -37,7 +37,7 @@ Vue.use(Progress); ### 样式定制 -可以使用`pivot-text`属性自定义文字,`color`属性自定义进度条颜色 +可以使用 `pivot-text` 属性自定义文字,`color` 属性自定义进度条颜色。 ```html diff --git a/src/pull-refresh/README.md b/src/pull-refresh/README.md index 2226c1591..f36c9ebb8 100644 --- a/src/pull-refresh/README.md +++ b/src/pull-refresh/README.md @@ -59,7 +59,7 @@ Use `success-text` to set the success prompt after the refresh is successful ### Custom Tips -Use slots to custom tips +Use slots to custom tips. ```html diff --git a/src/pull-refresh/README.zh-CN.md b/src/pull-refresh/README.zh-CN.md index d7bb3236a..6b0ca1ed2 100644 --- a/src/pull-refresh/README.zh-CN.md +++ b/src/pull-refresh/README.zh-CN.md @@ -45,7 +45,7 @@ export default { ### 成功提示 -通过`success-text`可以设置刷新成功后的顶部提示文案 +通过 `success-text` 可以设置刷新成功后的顶部提示文案。 ```html diff --git a/src/radio/README.md b/src/radio/README.md index 4a4c2714b..7baffe57c 100644 --- a/src/radio/README.md +++ b/src/radio/README.md @@ -14,7 +14,7 @@ Vue.use(RadioGroup); ### Basic Usage -Use `v-model` to bind the name of checked radio +Use `v-model` to bind the name of checked radio. ```html @@ -101,8 +101,8 @@ Use icon slot to custom icon > + } + ``` ```js diff --git a/src/radio/README.zh-CN.md b/src/radio/README.zh-CN.md index 14dce912f..bb4e79de6 100644 --- a/src/radio/README.zh-CN.md +++ b/src/radio/README.zh-CN.md @@ -14,7 +14,7 @@ Vue.use(RadioGroup); ### 基础用法 -通过`v-model`绑定值当前选中项的 name +通过 `v-model` 绑定值当前选中项的 name。 ```html @@ -35,7 +35,7 @@ export default { ### 水平排列 -将`direction`属性设置为`horizontal`后,单选框组会变成水平排列 +将 `direction` 属性设置为 `horizontal` 后,单选框组会变成水平排列。 ```html @@ -46,7 +46,7 @@ export default { ### 禁用状态 -通过`disabled`属性禁止选项切换,在`Radio`上设置`disabled`可以禁用单个选项 +通过 `disabled` 属性禁止选项切换,在 `Radio` 上设置 `disabled` 可以禁用单个选项。 ```html @@ -57,7 +57,7 @@ export default { ### 自定义形状 -将`shape`属性设置为`square`,单选框的形状会变成方形 +将 `shape` 属性设置为 `square`,单选框的形状会变成方形。 ```html @@ -68,7 +68,7 @@ export default { ### 自定义颜色 -通过`checked-color`属性设置选中状态的图标颜色 +通过 `checked-color` 属性设置选中状态的图标颜色。 ```html @@ -79,7 +79,7 @@ export default { ### 自定义大小 -通过`icon-size`属性可以自定义图标的大小 +通过 `icon-size` 属性可以自定义图标的大小。 ```html @@ -90,7 +90,7 @@ export default { ### 自定义图标 -通过`icon`插槽自定义图标,并通过`slotProps`判断是否为选中状态 +通过 `icon` 插槽自定义图标,并通过 `slotProps` 判断是否为选中状态。 ```html @@ -129,7 +129,7 @@ export default { ### 禁用文本点击 -设置`label-disabled`属性后,点击图标以外的内容不会触发单选框切换 +设置 `label-disabled` 属性后,点击图标以外的内容不会触发单选框切换。 ```html @@ -140,7 +140,7 @@ export default { ### 与 Cell 组件一起使用 -此时你需要再引入`Cell`和`CellGroup`组件 +此时你需要再引入 `Cell` 和 `CellGroup` 组件。 ```html diff --git a/src/search/README.zh-CN.md b/src/search/README.zh-CN.md index 7d0d2e80c..727eae565 100644 --- a/src/search/README.zh-CN.md +++ b/src/search/README.zh-CN.md @@ -13,7 +13,7 @@ Vue.use(Search); ### 基础用法 -v-model 用于控制搜索框中的文字,background 可以自定义搜索框外部背景色。 +`v-model` 用于控制搜索框中的文字,`background` 可以自定义搜索框外部背景色。 ```html diff --git a/src/skeleton/README.zh-CN.md b/src/skeleton/README.zh-CN.md index fc69a07ee..9d6845d52 100644 --- a/src/skeleton/README.zh-CN.md +++ b/src/skeleton/README.zh-CN.md @@ -13,7 +13,7 @@ Vue.use(Skeleton); ### 基础用法 -通过`title`属性显示标题占位图,通过`row`属性配置占位段落行数 +通过 `title` 属性显示标题占位图,通过 `row` 属性配置占位段落行数。 ```html @@ -21,7 +21,7 @@ Vue.use(Skeleton); ### 显示头像 -通过`avatar`属性显示头像占位图 +通过 `avatar` 属性显示头像占位图。 ```html @@ -29,7 +29,7 @@ Vue.use(Skeleton); ### 展示子组件 -将`loading`属性设置成`false`表示内容加载完成,此时会隐藏占位图,并显示`Skeleton`的子组件 +将 `loading` 属性设置成 `false` 表示内容加载完成,此时会隐藏占位图,并显示 `Skeleton` 的子组件。 ```html diff --git a/src/slider/README.md b/src/slider/README.md index 852935fba..5ec705a41 100644 --- a/src/slider/README.md +++ b/src/slider/README.md @@ -36,7 +36,7 @@ export default { ### Dual thumb -Add `range` attribute to open dual thumb mode +Add `range` attribute to open dual thumb mode. ```html diff --git a/src/slider/README.zh-CN.md b/src/slider/README.zh-CN.md index 6fb00719f..bfc77f4d6 100644 --- a/src/slider/README.zh-CN.md +++ b/src/slider/README.zh-CN.md @@ -36,7 +36,7 @@ export default { ### 双滑块 -添加`range`属性就可以开启双滑块模式,确保`value`的值是一个数组 +添加 `range` 属性就可以开启双滑块模式,确保 `value` 的值是一个数组。 ```html diff --git a/src/stepper/README.zh-CN.md b/src/stepper/README.zh-CN.md index e5098a668..4cc6968e1 100644 --- a/src/stepper/README.zh-CN.md +++ b/src/stepper/README.zh-CN.md @@ -2,7 +2,7 @@ ### 介绍 -步进器由增加按钮、减少按钮和输入框组成,用于在一定范围内输入、调整数字 +步进器由增加按钮、减少按钮和输入框组成,用于在一定范围内输入、调整数字。 ### 引入 @@ -17,7 +17,7 @@ Vue.use(Stepper); ### 基础用法 -通过`v-model`绑定输入值,可以通过`change`事件监听到输入值的变化 +通过 `v-model` 绑定输入值,可以通过 `change` 事件监听到输入值的变化。 ```html @@ -35,7 +35,7 @@ export default { ### 步长设置 -通过`step`属性设置每次点击增加或减少按钮时变化的值,默认为`1` +通过 `step` 属性设置每次点击增加或减少按钮时变化的值,默认为 `1`。 ```html @@ -43,7 +43,7 @@ export default { ### 限制输入范围 -通过`min`和`max`属性限制输入值的范围 +通过 `min` 和 `max` 属性限制输入值的范围。 ```html @@ -51,7 +51,7 @@ export default { ### 限制输入整数 -设置`integer`属性后,输入框将限制只能输入整数 +设置 `integer` 属性后,输入框将限制只能输入整数。 ```html @@ -59,7 +59,7 @@ export default { ### 禁用状态 -通过设置`disabled`属性来禁用步进器,禁用状态下无法点击按钮或修改输入框 +通过设置 `disabled` 属性来禁用步进器,禁用状态下无法点击按钮或修改输入框。 ```html @@ -67,7 +67,7 @@ export default { ### 禁用输入框 -通过设置`disable-input`属性来禁用输入框,此时按钮仍然可以点击 +通过设置 `disable-input` 属性来禁用输入框,此时按钮仍然可以点击。 ```html @@ -75,7 +75,7 @@ export default { ### 固定小数位数 -通过设置`decimal-length`属性可以保留固定的小数位数 +通过设置 `decimal-length` 属性可以保留固定的小数位数。 ```html @@ -83,7 +83,7 @@ export default { ### 自定义大小 -通过`input-width`属性设置输入框宽度,通过`button-size`属性设置按钮大小和输入框高度 +通过 `input-width` 属性设置输入框宽度,通过 `button-size` 属性设置按钮大小和输入框高度。 ```html @@ -91,7 +91,7 @@ export default { ### 异步变更 -如果需要异步地修改输入框的值,可以设置`async-change`属性,并在`change`事件中手动修改`value` +如果需要异步地修改输入框的值,可以设置 `async-change` 属性,并在 `change` 事件中手动修改 `value`。 ```html @@ -123,7 +123,7 @@ export default { ### 圆角风格 -将 theme 设置为 `round` 来展示圆角风格的步进器 +将 `theme` 设置为 `round` 来展示圆角风格的步进器。 ```html diff --git a/src/steps/README.zh-CN.md b/src/steps/README.zh-CN.md index d4610bc29..bbbaaa4f3 100644 --- a/src/steps/README.zh-CN.md +++ b/src/steps/README.zh-CN.md @@ -14,7 +14,7 @@ Vue.use(Steps); ### 基础用法 -`active`属性表示当前步骤的索引,从 0 起计 +`active` 属性表示当前步骤的索引,从 0 起计。 ```html @@ -37,7 +37,7 @@ export default { ### 自定义样式 -可以通过`active-icon`和`active-color`属性设置激活状态下的图标和颜色 +可以通过 `active-icon` 和 `active-color` 属性设置激活状态下的图标和颜色。 ```html @@ -50,7 +50,7 @@ export default { ### 竖向步骤条 -可以通过设置`direction`属性来改变步骤条的显示方向 +可以通过设置 `direction` 属性来改变步骤条的显示方向。 ```html diff --git a/src/sticky/README.zh-CN.md b/src/sticky/README.zh-CN.md index 696d07055..79c9f4467 100644 --- a/src/sticky/README.zh-CN.md +++ b/src/sticky/README.zh-CN.md @@ -17,7 +17,7 @@ Vue.use(Sticky); ### 基础用法 -将内容包裹在`Sticky`组件内即可 +将内容包裹在 `Sticky` 组件内即可。 ```html @@ -27,7 +27,7 @@ Vue.use(Sticky); ### 吸顶距离 -通过`offset-top`属性可以设置组件在吸顶时与顶部的距离 +通过 `offset-top` 属性可以设置组件在吸顶时与顶部的距离。 ```html @@ -37,7 +37,7 @@ Vue.use(Sticky); ### 指定容器 -通过`container`属性可以指定组件的容器,页面滚动时,组件会始终保持在容器范围内,当组件即将超出容器底部时,会固定在容器的底部 +通过 `container` 属性可以指定组件的容器,页面滚动时,组件会始终保持在容器范围内,当组件即将超出容器底部时,会固定在容器的底部。 ```html
diff --git a/src/submit-bar/README.zh-CN.md b/src/submit-bar/README.zh-CN.md index dbc0c7adb..553d69d1a 100644 --- a/src/submit-bar/README.zh-CN.md +++ b/src/submit-bar/README.zh-CN.md @@ -19,7 +19,7 @@ Vue.use(SubmitBar); ### 禁用状态 -禁用状态下不会触发`submit`事件 +禁用状态下不会触发 `submit` 事件。 ```html diff --git a/src/swipe-cell/README.zh-CN.md b/src/swipe-cell/README.zh-CN.md index 6a1184365..66b62c287 100644 --- a/src/swipe-cell/README.zh-CN.md +++ b/src/swipe-cell/README.zh-CN.md @@ -13,7 +13,7 @@ Vue.use(SwipeCell); ### 基础用法 -`SwipeCell`组件提供了`left`和`right`两个插槽,用于定义两侧滑动区域的内容 +`SwipeCell` 组件提供了 `left` 和 `right` 两个插槽,用于定义两侧滑动区域的内容。 ```html @@ -30,7 +30,7 @@ Vue.use(SwipeCell); ### 自定义内容 -`SwipeCell`内容可以嵌套任意内容,比如嵌套一个商品卡片 +`SwipeCell` 可以嵌套任意内容,比如嵌套一个商品卡片。 ```html @@ -61,7 +61,7 @@ Vue.use(SwipeCell); ### 异步关闭 -通过传入`before-close`回调函数,可以自定义两侧滑动内容关闭时的行为 +通过传入 `before-close` 回调函数,可以自定义两侧滑动内容关闭时的行为。 ```html diff --git a/src/switch-cell/README.md b/src/switch-cell/README.md index beb73c775..fb51c9935 100644 --- a/src/switch-cell/README.md +++ b/src/switch-cell/README.md @@ -35,7 +35,7 @@ export default { ### Disabled -use `disabled` property to disable the component +Use `disabled` property to disable the component. ```html @@ -45,7 +45,7 @@ use `disabled` property to disable the component ### Loading -use `loading` property to keep component in loading state +Use `loading` property to keep component in loading state. ```html diff --git a/src/switch-cell/README.zh-CN.md b/src/switch-cell/README.zh-CN.md index d91c3cd58..fc2062a33 100644 --- a/src/switch-cell/README.zh-CN.md +++ b/src/switch-cell/README.zh-CN.md @@ -43,7 +43,7 @@ export default { ### 禁用状态 -通过`disabled`属性可以将组件设置为禁用状态 +通过 `disabled` 属性可以将组件设置为禁用状态。 ```html @@ -53,7 +53,7 @@ export default { ### 加载状态 -通过`loading`属性可以将组件设置为加载状态 +通过 `loading` 属性可以将组件设置为加载状态。 ```html diff --git a/src/switch/README.zh-CN.md b/src/switch/README.zh-CN.md index 4990a3fd7..37a52d986 100644 --- a/src/switch/README.zh-CN.md +++ b/src/switch/README.zh-CN.md @@ -13,7 +13,7 @@ Vue.use(Switch); ### 基础用法 -通过`v-model`绑定开关的选中状态,`true`表示开,`false`表示关 +通过 `v-model` 绑定开关的选中状态,`true` 表示开,`false` 表示关。 ```html @@ -31,7 +31,7 @@ export default { ### 禁用状态 -通过`disabled`属性来禁用开关,禁用状态下开关不可点击 +通过 `disabled` 属性来禁用开关,禁用状态下开关不可点击。 ```html @@ -39,7 +39,7 @@ export default { ### 加载状态 -通过`loading`属性设置开关为加载状态,加载状态下开关不可点击 +通过 `loading` 属性设置开关为加载状态,加载状态下开关不可点击。 ```html @@ -47,7 +47,7 @@ export default { ### 自定义大小 -通过`size`属性自定义开关的大小 +通过 `size` 属性自定义开关的大小。 ```html @@ -55,7 +55,7 @@ export default { ### 自定义颜色 -`active-color`属性表示打开时的背景色,`inactive-color`表示关闭时的背景色 +`active-color` 属性表示打开时的背景色,`inactive-color` 表示关闭时的背景色。 ```html @@ -63,7 +63,7 @@ export default { ### 异步控制 -需要异步控制开关时,可以使用`value`属性和`input`事件代替`v-model`,并在`input`事件回调函数中手动处理开关状态 +需要异步控制开关时,可以使用 `value` 属性和 `input` 事件代替 `v-model`,并在 `input` 事件回调函数中手动处理开关状态。 ```html diff --git a/src/tabbar/README.md b/src/tabbar/README.md index d38fe1a86..48af8bb8e 100644 --- a/src/tabbar/README.md +++ b/src/tabbar/README.md @@ -67,7 +67,7 @@ export default { ### Custom Icon -Use `icon` slot to custom icon +Use `icon` slot to custom icon. ```html diff --git a/src/tabbar/README.zh-CN.md b/src/tabbar/README.zh-CN.md index 2578c0109..36e3ce51c 100644 --- a/src/tabbar/README.zh-CN.md +++ b/src/tabbar/README.zh-CN.md @@ -14,7 +14,7 @@ Vue.use(TabbarItem); ### 基础用法 -`v-model`默认绑定选中标签的索引值,通过修改`v-model`即可切换选中的标签 +`v-model` 默认绑定选中标签的索引值,通过修改 `v-model` 即可切换选中的标签。 ```html @@ -37,7 +37,7 @@ export default { ### 通过名称匹配 -在标签指定`name`属性的情况下,`v-model`的值为当前标签的`name` +在标签指定 `name` 属性的情况下,`v-model` 的值为当前标签的 `name`。 ```html @@ -60,7 +60,7 @@ export default { ### 徽标提示 -设置`dot`属性后,会在图标右上角展示一个小红点。设置`badge`属性后,会在图标右上角展示相应的徽标 +设置 `dot` 属性后,会在图标右上角展示一个小红点;设置 `badge` 属性后,会在图标右上角展示相应的徽标。 ```html @@ -73,7 +73,7 @@ export default { ### 自定义图标 -通过 icon 插槽自定义图标,可以通过 `slot-scope` 判断标签是否选中 +通过 `icon` 插槽自定义图标,可以通过 `slot-scope` 判断标签是否选中。 ```html @@ -138,7 +138,7 @@ export default { ### 路由模式 -标签栏支持路由模式,用于搭配`vue-router`使用。路由模式下会匹配页面路径和标签的`to`属性,并自动选中对应的标签 +标签栏支持路由模式,用于搭配 `vue-router` 使用。路由模式下会匹配页面路径和标签的 `to` 属性,并自动选中对应的标签。 ```html diff --git a/src/toast/README.zh-CN.md b/src/toast/README.zh-CN.md index 30fcbf9eb..310c1a62b 100644 --- a/src/toast/README.zh-CN.md +++ b/src/toast/README.zh-CN.md @@ -82,7 +82,7 @@ Toast({ ### 动态更新提示 -执行 Toast 方法时会返回对应的 Toast 实例,通过修改实例上的 message 属性可以实现动态更新提示的效果。 +执行 Toast 方法时会返回对应的 Toast 实例,通过修改实例上的 `message` 属性可以实现动态更新提示的效果。 ```js const toast = Toast.loading({ @@ -132,7 +132,7 @@ toast2.clear(); ### 修改默认配置 -通过`Toast.setDefaultOptions`函数可以全局修改 Toast 的默认配置。 +通过 `Toast.setDefaultOptions` 函数可以全局修改 Toast 的默认配置。 ```js // 将所有 Toast 的展示时长设置为 2000 毫秒 diff --git a/src/tree-select/README.zh-CN.md b/src/tree-select/README.zh-CN.md index 8bfcbf363..6823be6c7 100644 --- a/src/tree-select/README.zh-CN.md +++ b/src/tree-select/README.zh-CN.md @@ -13,7 +13,7 @@ Vue.use(TreeSelect); ### 单选模式 -`item`为分类显示所需的数据,数据格式见下方示例。`main-active-index`表示左侧高亮选项的索引,`active-id`表示右侧高亮选项的 id +`item` 为分类显示所需的数据,数据格式见下方示例。`main-active-index` 表示左侧高亮选项的索引,`active-id` 表示右侧高亮选项的 id。 ```html @@ -91,7 +91,7 @@ export default { ### 徽标提示 -设置`dot`属性后,会在图标右上角展示一个小红点。设置`badge`属性后,会在图标右上角展示相应的徽标 +设置 `dot` 属性后,会在图标右上角展示一个小红点;设置 `badge` 属性后,会在图标右上角展示相应的徽标。 ```html .preview-cover { position: absolute; - box-sizing: border-box; bottom: 0; + box-sizing: border-box; width: 100%; padding: 4px; color: #fff; diff --git a/src/uploader/README.zh-CN.md b/src/uploader/README.zh-CN.md index 09da6f32a..add7f93ec 100644 --- a/src/uploader/README.zh-CN.md +++ b/src/uploader/README.zh-CN.md @@ -32,7 +32,7 @@ export default { ### 文件预览 -通过`v-model`可以绑定已经上传的文件列表,并展示文件列表的预览图。 +通过 `v-model` 可以绑定已经上传的文件列表,并展示文件列表的预览图。 ```html @@ -156,8 +156,8 @@ export default {