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

feat(Field): add clear-trigger prop (#4461)

Browse Source 
* feat(Field): add clear-trigger prop

* docs(Field): update doc

* fix(Field): adjust code
This commit is contained in:
nemo-shen 2021-09-07 10:06:22 +08:00 committed by GitHub
parent 583581fbee
commit cc0df907e7
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 72 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/field/README.md
View File

@ -214,7 +214,7 @@ Page({
### Props
| 参数 | 说明 | 类型 | 默认值 |
| --- | --- | --- | --- |
| ------------------------ | ----------------------------------------------------------------------------------------------------------- | ------------------- | ------- |
| name | 在表单内提交时的标识符 | _string_ | - |
| label | 输入框左侧文本 | _string_ | - |
| size | 单元格大小，可选值为 `large` | _string_ | - |
@ -256,11 +256,12 @@ Page({
| auto-focus | 自动聚焦，拉起键盘 | _boolean_ | `false` |
| disable-default-padding | 是否去掉 iOS 下的默认内边距，只对 textarea 有效 | _boolean_ | `true` |
| cursor | 指定 focus 时的光标位置 | _number_ | `-1` |
| clear-trigger `v1.8.4` | 显示清除图标的时机，`always` 表示输入框不为空时展示，<br>`focus` 表示输入框聚焦且不为空时展示 | _string_ | `focus` |
### Events
| 事件 | 说明 | 回调参数 |
| --- | --- | --- |
| ------------------------- | ---------------------------------------- | -------------------------------------------------------------------------------------------------------- |
| bind:input | 输入内容时触发 | event.detail: 当前输入值 |
| bind:change | 输入内容时触发 | event.detail: 当前输入值 |
| bind:confirm | 点击完成按钮时触发 | event.detail: 当前输入值 |

20
packages/field/index.ts
View File

@ -37,6 +37,10 @@ VantComponent({
type: Boolean,
observer: 'setShowClear',
},
clearTrigger: {
type: String,
value: 'focus',
},
border: {
type: Boolean,
value: true,
@ -144,12 +148,20 @@ VantComponent({
},
setShowClear() {
const { clearable, readonly } = this.data;
const { clearable, readonly, clearTrigger } = this.data;
const { focused, value } = this;
this.setData({
showClear: !!clearable && !!focused && !!value && !readonly,
});
let showClear = false;
if (clearable && !readonly) {
const hasValue = !!value;
const trigger =
clearTrigger === 'always' || (clearTrigger === 'focus' && focused);
showClear = hasValue && trigger;
}
this.setData({ showClear });
},
noop() {},