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

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

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

* feat(AddressEdit): add change event for name and tel input
This commit is contained in:
ShuGang Zhou 2023-09-23 17:50:37 +08:00 committed by GitHub
parent c0c0bdce17
commit 4abc67e4ac
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 27 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
packages/vant/src/address-edit/AddressEdit.tsx
View File

@ -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}

1
packages/vant/src/address-edit/README.md
View File

@ -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 | - |

1
packages/vant/src/address-edit/README.zh-CN.md
View File

@ -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 | 点击收件地区时触发 | - |

18
packages/vant/src/address-edit/test/index.spec.ts
View File

@ -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: {