From 9e17b13164e57ff09140d755870853f702a89a39 Mon Sep 17 00:00:00 2001 From: nemo-shen Date: Mon, 6 Sep 2021 19:31:15 +0800 Subject: [PATCH 1/3] feat(Search): add clear-trigger prop --- packages/search/README.md | 75 +++++++++++++++++++------------------- packages/search/index.ts | 4 ++ packages/search/index.wxml | 1 + 3 files changed, 43 insertions(+), 37 deletions(-) diff --git a/packages/search/README.md b/packages/search/README.md index 2aa1293c..1f0ee94c 100644 --- a/packages/search/README.md +++ b/packages/search/README.md @@ -111,49 +111,50 @@ Page({ ### Props -| 参数 | 说明 | 类型 | 默认值 | 版本 | -| --- | --- | --- | --- | --- | -| name | 在表单内提交时的标识符 | _string_ | - | - | -| label | 搜索框左侧文本 | _string_ | - | - | -| shape | 形状，可选值为 `round` | _string_ | `square` | - | -| value | 当前输入的值 | _string \| number_ | - | - | -| background | 搜索框背景色 | _string_ | `#f2f2f2` | - | -| show-action | 是否在搜索框右侧显示取消按钮 | _boolean_ | `false` | - | -| action-text | 取消按钮文字 | _boolean_ | `取消` | 1.0.0 | -| focus | 获取焦点 | _boolean_ | `false` | - | -| error | 是否将输入内容标红 | _boolean_ | `false` | - | -| disabled | 是否禁用输入框 | _boolean_ | `false` | - | -| readonly | 是否只读 | _boolean_ | `false` | - | -| clearable | 是否启用清除控件 | _boolean_ | `true` | - | -| maxlength | 最大输入长度，设置为 -1 的时候不限制最大长度 | _number_ | `-1` | - | -| use-action-slot | 是否使用 action slot | _boolean_ | `false` | - | -| placeholder | 输入框为空时占位符 | _string_ | - | - | -| placeholder-style | 指定占位符的样式 | _string_ | - | - | -| input-align | 输入框内容对齐方式，可选值为 `center` `right` | _string_ | `left` | - | -| use-left-icon-slot | 是否使用输入框左侧图标 slot | _boolean_ | `false` | - | -| use-right-icon-slot | 是否使用输入框右侧图标 slot | _boolean_ | `false` | - | -| left-icon | 输入框左侧图标名称或图片链接，可选值见 Icon 组件（如果设置了 use-left-icon-slot，则该属性无效） | _string_ | `search` | - | -| right-icon | 输入框右侧图标名称或图片链接，可选值见 Icon 组件（如果设置了 use-right-icon-slot，则该属性无效） | _string_ | - | - | +| 参数 | 说明 | 类型 | 默认值 | +| ---------------------- | ------------------------------------------------------------------------------------------------- | ------------------ | --- | +| name | 在表单内提交时的标识符 | _string_ | - | +| label | 搜索框左侧文本 | _string_ | - | +| shape | 形状，可选值为 `round` | _string_ | `square` | +| value | 当前输入的值 | _string \j number_ | - | +| background | 搜索框背景色 | _string_ | `#f2f2f2` | +| show-action | 是否在搜索框右侧显示取消按钮 | _boolean_ | `false` | +| action-text `v1.0.0` | 取消按钮文字 | _boolean_ | `取消` | +| focus | 获取焦点 | _boolean_ | `false` | +| error | 是否将输入内容标红 | _boolean_ | `false` | +| disabled | 是否禁用输入框 | _boolean_ | `false` | +| readonly | 是否只读 | _boolean_ | `false` | +| clearable | 是否启用清除控件 | _boolean_ | `true` | +| clear-trigger `v1.8.4` | 显示清除图标的时机，`always` 表示输入框不为空时展示，
`focus` 表示输入框聚焦且不为空时展示 | _string_ | `focus` | +| maxlength | 最大输入长度，设置为 -1 的时候不限制最大长度 | _number_ | `-1` | +| use-action-slot | 是否使用 action slot | _boolean_ | `false` | +| placeholder | 输入框为空时占位符 | _string_ | - | +| placeholder-style | 指定占位符的样式 | _string_ | - | +| input-align | 输入框内容对齐方式，可选值为 `center` `right` | _string_ | `left` | +| use-left-icon-slot | 是否使用输入框左侧图标 slot | _boolean_ | `false` | +| use-right-icon-slot | 是否使用输入框右侧图标 slot | _boolean_ | `false` | +| left-icon | 输入框左侧图标名称或图片链接，可选值见 Icon 组件（如果设置了 use-left-icon-slot，则该属性无效） | _string_ | `search` | +| right-icon | 输入框右侧图标名称或图片链接，可选值见 Icon 组件（如果设置了 use-right-icon-slot，则该属性无效） | _string_ | - | ### Events -| 事件名 | 说明 | 参数 | -| ----------- | ------------------ | ------------------------ | -| bind:search | 确定搜索时触发 | event.detail: 当前输入值 | -| bind:change | 输入内容变化时触发 | event.detail: 当前输入值 | -| bind:cancel | 取消搜索搜索时触发 | - | -| bind:focus | 输入框聚焦时触发 | - | -| bind:blur | 输入框失焦时触发 | - | -| bind:clear | 点击清空控件时触发 | - | -| bind:click-input | 点击搜索区域时触发 | - | +| 事件名 | 说明 | 参数 | +| ---------------- | ------------------ | ------------------------ | +| bind:search | 确定搜索时触发 | event.detail: 当前输入值 | +| bind:change | 输入内容变化时触发 | event.detail: 当前输入值 | +| bind:cancel | 取消搜索搜索时触发 | - | +| bind:focus | 输入框聚焦时触发 | - | +| bind:blur | 输入框失焦时触发 | - | +| bind:clear | 点击清空控件时触发 | - | +| bind:click-input | 点击搜索区域时触发 | - | ### Slot -| 名称 | 说明 | -| --- | --- | -| action | 自定义搜索框右侧按钮，需要在`use-action-slot`为 true 时才会显示 | -| label | 自定义搜索框左侧文本 | -| left-icon | 自定义输入框左侧图标，需要在`use-left-icon-slot`为 true 时才会显示 | +| 名称 | 说明 | +| ---------- | ------------------------------------------------------------------- | +| action | 自定义搜索框右侧按钮，需要在`use-action-slot`为 true 时才会显示 | +| label | 自定义搜索框左侧文本 | +| left-icon | 自定义输入框左侧图标，需要在`use-left-icon-slot`为 true 时才会显示 | | right-icon | 自定义输入框右侧图标，需要在`use-right-icon-slot`为 true 时才会显示 | ### 外部样式类 diff --git a/packages/search/index.ts b/packages/search/index.ts index 48d143c0..43cf5fa2 100644 --- a/packages/search/index.ts +++ b/packages/search/index.ts @@ -44,6 +44,10 @@ VantComponent({ type: Boolean, value: true, }, + clearTrigger: { + type: String, + value: 'focus', + }, }, methods: { diff --git a/packages/search/index.wxml b/packages/search/index.wxml index 5d77fca8..15a99fba 100644 --- a/packages/search/index.wxml +++ b/packages/search/index.wxml @@ -21,6 +21,7 @@ disabled="{{ disabled }}" readonly="{{ readonly }}" clearable="{{ clearable }}" + clear-trigger="{{ clearTrigger }}" maxlength="{{ maxlength }}" input-align="{{ inputAlign }}" input-class="input-class" From 0d1f370059ab5573cc6933cfab49dd95d7337f18 Mon Sep 17 00:00:00 2001 From: nemo-shen Date: Mon, 6 Sep 2021 19:34:33 +0800 Subject: [PATCH 2/3] docs(Search): update doc --- packages/search/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/search/README.md b/packages/search/README.md index 1f0ee94c..d16fec09 100644 --- a/packages/search/README.md +++ b/packages/search/README.md @@ -116,7 +116,7 @@ Page({ | name | 在表单内提交时的标识符 | _string_ | - | | label | 搜索框左侧文本 | _string_ | - | | shape | 形状，可选值为 `round` | _string_ | `square` | -| value | 当前输入的值 | _string \j number_ | - | +| value | 当前输入的值 | _string \| number_ | - | | background | 搜索框背景色 | _string_ | `#f2f2f2` | | show-action | 是否在搜索框右侧显示取消按钮 | _boolean_ | `false` | | action-text `v1.0.0` | 取消按钮文字 | _boolean_ | `取消` | From 7cfe300ed8fddcb153aeaf5921443ec4d48a0cc7 Mon Sep 17 00:00:00 2001 From: nemo-shen Date: Tue, 7 Sep 2021 13:57:19 +0800 Subject: [PATCH 3/3] docs(Search): update doc --- packages/search/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/search/README.md b/packages/search/README.md index a3ab12d5..bb3e0b8f 100644 --- a/packages/search/README.md +++ b/packages/search/README.md @@ -126,6 +126,7 @@ Page({ | readonly | 是否只读 | _boolean_ | `false` | | clearable | 是否启用清除控件 | _boolean_ | `true` | | clear-trigger `v1.8.4` | 显示清除图标的时机，`always` 表示输入框不为空时展示，
`focus` 表示输入框聚焦且不为空时展示 | _string_ | `focus` | +| clear-icon `v1.8.4` | 清除[图标名称](#/icon)或图片链接 | _string_ | `clear` | | maxlength | 最大输入长度，设置为 -1 的时候不限制最大长度 | _number_ | `-1` | | use-action-slot | 是否使用 action slot | _boolean_ | `false` | | placeholder | 输入框为空时占位符 | _string_ | - | @@ -135,7 +136,6 @@ Page({ | use-right-icon-slot | 是否使用输入框右侧图标 slot | _boolean_ | `false` | | left-icon | 输入框左侧图标名称或图片链接，可选值见 Icon 组件（如果设置了 use-left-icon-slot，则该属性无效） | _string_ | `search` | | right-icon | 输入框右侧图标名称或图片链接，可选值见 Icon 组件（如果设置了 use-right-icon-slot，则该属性无效） | _string_ | - | -| clear-icon `v1.8.4` | 清除[图标名称](#/icon)或图片链接 | _string_ | `clear` | ### Events