From 4abc67e4ac5aeef5080199447a92568032d7908e Mon Sep 17 00:00:00 2001
From: ShuGang Zhou <zhousg1007@qq.com>
Date: Sat, 23 Sep 2023 17:50:37 +0800
Subject: [PATCH] feat(AddressEdit): add change event for name and tel input
 (#12310)

* feat(AddressEdit): add change event for name and tel input

* feat(AddressEdit): add change event for name and tel input
---
 packages/vant/src/address-edit/AddressEdit.tsx |  7 +++++++
 packages/vant/src/address-edit/README.md       |  1 +
 packages/vant/src/address-edit/README.zh-CN.md |  1 +
 .../vant/src/address-edit/test/index.spec.ts   | 18 ++++++++++++++++++
 4 files changed, 27 insertions(+)

diff --git a/packages/vant/src/address-edit/AddressEdit.tsx b/packages/vant/src/address-edit/AddressEdit.tsx
index 73ccb73b7..eec2212a3 100644
--- a/packages/vant/src/address-edit/AddressEdit.tsx
+++ b/packages/vant/src/address-edit/AddressEdit.tsx
@@ -95,6 +95,7 @@ export default defineComponent({
   emits: [
     'save',
     'focus',
+    'change',
     'delete',
     'clickArea',
     'changeArea',
@@ -136,6 +137,10 @@ export default defineComponent({
       emit('focus', key);
     };
 
+    const onChange = (key: string, value: string) => {
+      emit('change', { key, value });
+    };
+
     const rules = computed<Record<string, FieldRule[]>>(() => {
       const { validator, telValidator } = props;
 
@@ -273,6 +278,7 @@ export default defineComponent({
               rules={rules.value.name}
               placeholder={t('name')}
               onFocus={() => onFocus('name')}
+              onUpdate:modelValue={(val) => onChange('name', val)}
             />
             <Field
               v-model={data.tel}
@@ -283,6 +289,7 @@ export default defineComponent({
               maxlength={props.telMaxlength}
               placeholder={t('tel')}
               onFocus={() => onFocus('tel')}
+              onUpdate:modelValue={(val) => onChange('tel', val)}
             />
             <Field
               v-show={props.showArea}
diff --git a/packages/vant/src/address-edit/README.md b/packages/vant/src/address-edit/README.md
index a5d02f65a..06ea69e36 100644
--- a/packages/vant/src/address-edit/README.md
+++ b/packages/vant/src/address-edit/README.md
@@ -101,6 +101,7 @@ export default {
 | --- | --- | --- |
 | save | Emitted when the save button is clicked | _info: AddressEditInfo_ |
 | focus | Emitted when field is focused | _key: string_ |
+| change | Emitted when only the name and tel field are changed | _{key: string, value: string}_ |
 | delete | Emitted when confirming delete | _info: AddressEditInfo_ |
 | select-search | Emitted when a search result is selected | _value: string_ |
 | click-area | Emitted when the area field is clicked | - |
diff --git a/packages/vant/src/address-edit/README.zh-CN.md b/packages/vant/src/address-edit/README.zh-CN.md
index 0ac0b578e..8af3efc9e 100644
--- a/packages/vant/src/address-edit/README.zh-CN.md
+++ b/packages/vant/src/address-edit/README.zh-CN.md
@@ -101,6 +101,7 @@ export default {
 | --- | --- | --- |
 | save | 点击保存按钮时触发 | _info: AddressEditInfo_ |
 | focus | 输入框聚焦时触发 | _key: string_ |
+| change | 仅 `name` 和 `tel` 输入框值改变触发 | _{key: string, value: string}_ |
 | delete | 确认删除地址时触发 | _info: AddressEditInfo_ |
 | select-search | 选中搜索结果时触发 | _value: string_ |
 | click-area | 点击收件地区时触发 | - |
diff --git a/packages/vant/src/address-edit/test/index.spec.ts b/packages/vant/src/address-edit/test/index.spec.ts
index dea8b1cc1..c0bfe2967 100644
--- a/packages/vant/src/address-edit/test/index.spec.ts
+++ b/packages/vant/src/address-edit/test/index.spec.ts
@@ -109,6 +109,24 @@ test('should emit changeDetail event after changing address detail', () => {
   expect(wrapper.emitted('changeDetail')).toEqual([['123']]);
 });
 
+test('should emit change event after name or tel input', () => {
+  const wrapper = mount(AddressEdit);
+
+  const field = wrapper.findAll('.van-field__control')[0];
+  (field.element as HTMLInputElement).value = '123';
+  field.trigger('input');
+  expect(wrapper.emitted('change')?.[0]).toEqual([
+    { key: 'name', value: '123' },
+  ]);
+
+  const field1 = wrapper.findAll('.van-field__control')[1];
+  (field1.element as HTMLInputElement).value = '123';
+  field1.trigger('input');
+  expect(wrapper.emitted('change')?.[1]).toEqual([
+    { key: 'tel', value: '123' },
+  ]);
+});
+
 test('should show search result after focusing to address detail', async () => {
   const wrapper = mount(AddressEdit, {
     props: {