diff --git a/packages/field/README.md b/packages/field/README.md index f6ff1228..655d45af 100644 --- a/packages/field/README.md +++ b/packages/field/README.md @@ -257,14 +257,15 @@ Page({ | disable-default-padding | 是否去掉 iOS 下的默认内边距,只对 textarea 有效 | _boolean_ | `true` | | cursor | 指定 focus 时的光标位置 | _number_ | `-1` | | clear-trigger `v1.8.4` | 显示清除图标的时机,`always` 表示输入框不为空时展示,
`focus` 表示输入框聚焦且不为空时展示 | _string_ | `focus` | -| always-embed `v1.9.2` | 强制 input 处于同层状态,默认 focus 时 input 会切到非同层状态 (仅在 iOS 下生效) | _boolean_ | `false` | +| always-embed `v1.9.2` | 强制 input 处于同层状态,默认 focus 时 input 会切到非同层状态 (仅在 iOS 下生效) | _boolean_ | `false` | +| extra-event-params `v1.10.12` | 开启事件增强模式,会在 input 和 change 事件额外提供 `cursor` 和 `keyCode` 参数,计划在下一个大版本作为默认行为 | _boolean_ | `false` | ### Events | 事件 | 说明 | 回调参数 | | --- | --- | --- | -| bind:input | 输入内容时触发 | event.detail: 当前输入值 | -| bind:change | 输入内容时触发 | event.detail: 当前输入值 | +| bind:input | 输入内容时触发 | event.detail: 当前输入值; 在 extra-event-params 为 `true` 时, event.detail.value: 当前输入值, event.detail.cursor: 光标位置, event.detail.keyCode: 键值 | +| bind:change | 输入内容时触发 | event.detail: 当前输入值; 在 extra-event-params 为 `true` 时, event.detail.value: 当前输入值, event.detail.cursor: 光标位置, event.detail.keyCode: 键值 | | bind:confirm | 点击完成按钮时触发 | event.detail: 当前输入值 | | bind:click-icon | 点击尾部图标时触发 | - | | bind:focus | 输入框聚焦时触发 | event.detail.value: 当前输入值;
event.detail.height: 键盘高度 | diff --git a/packages/field/index.ts b/packages/field/index.ts index ded9294f..48092155 100644 --- a/packages/field/index.ts +++ b/packages/field/index.ts @@ -1,6 +1,7 @@ import { nextTick } from '../common/utils'; import { VantComponent } from '../common/component'; import { commonProps, inputProps, textareaProps } from './props'; +import { InputDetails } from './types'; VantComponent({ field: true, @@ -53,6 +54,10 @@ VantComponent({ type: String, value: 'clear', }, + extraEventParams: { + type: Boolean, + value: false, + }, }, data: { @@ -72,7 +77,8 @@ VantComponent({ this.value = value; this.setShowClear(); - this.emitChange(); + + this.emitChange(event.detail); }, onFocus( @@ -105,7 +111,7 @@ VantComponent({ this.setShowClear(); nextTick(() => { - this.emitChange(); + this.emitChange({ value: '' }); this.$emit('clear', ''); }); }, @@ -119,7 +125,7 @@ VantComponent({ this.$emit('confirm', value); }, - setValue(value) { + setValue(value: string) { this.value = value; this.setShowClear(); @@ -127,7 +133,7 @@ VantComponent({ this.setData({ innerValue: '' }); } - this.emitChange(); + this.emitChange({ value }); }, onLineChange(event: WechatMiniprogram.TextareaLineChange) { @@ -142,12 +148,16 @@ VantComponent({ this.$emit('keyboardheightchange', event.detail); }, - emitChange() { - this.setData({ value: this.value }); + emitChange(detail: InputDetails) { + const { extraEventParams } = this.data; + + this.setData({ value: detail.value }); nextTick(() => { - this.$emit('input', this.value); - this.$emit('change', this.value); + const data = extraEventParams ? detail : detail.value; + + this.$emit('input', data); + this.$emit('change', data); }); }, diff --git a/packages/field/types.ts b/packages/field/types.ts new file mode 100644 index 00000000..f415cc3d --- /dev/null +++ b/packages/field/types.ts @@ -0,0 +1,8 @@ +export interface InputDetails { + /** 输入框内容 */ + value: string; + /** 光标位置 */ + cursor?: number; + /** keyCode 为键值 (目前工具还不支持返回keyCode参数) `2.1.0` 起支持 */ + keyCode?: number; +}