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(Field): add inputmode props (#13208)

Browse Source
This commit is contained in:
yuhengshen 2024-11-17 09:37:55 +08:00 committed by GitHub
parent eca18a1dad
commit 07e1634882
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 15 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/vant/src/field/Field.tsx
View File

@ -9,6 +9,7 @@ import {
defineComponent,
type PropType,
type ExtractPropTypes,
type HTMLAttributes,
} from 'vue';
// Utils
@ -112,6 +113,7 @@ export const fieldSharedProps = {
type: Boolean,
default: null,
},
inputmode: String as PropType<HTMLAttributes['inputmode']>,
};
export const fieldProps = extend({}, cellSharedProps, fieldSharedProps, {
@ -539,10 +541,12 @@ export default defineComponent({
};
if (props.type === 'textarea') {
return <textarea {...inputAttrs} />;
return <textarea {...inputAttrs} inputmode={props.inputmode} />;
}
return <input {...mapInputType(props.type)} {...inputAttrs} />;
return (
<input {...mapInputType(props.type, props.inputmode)} {...inputAttrs} />
);
};
const renderLeftIcon = () => {

19
packages/vant/src/field/utils.ts
View File

@ -91,27 +91,26 @@ export function resizeTextarea(
}
}
export function mapInputType(type: FieldType): {
export function mapInputType(
type: FieldType,
inputmode?: HTMLAttributes['inputmode'],
): {
type: InputHTMLAttributes['type'];
inputmode?: HTMLAttributes['inputmode'];
} {
// type="number" is weird in iOS, and can't prevent dot in Android
// so use inputmode to set keyboard in modern browsers
if (type === 'number') {
return {
type: 'text',
inputmode: 'decimal',
};
type = 'text';
inputmode ??= 'decimal';
}
if (type === 'digit') {
return {
type: 'tel',
inputmode: 'numeric',
};
type = 'tel';
inputmode ??= 'numeric';
}
return { type };
return { type, inputmode };
}
// get correct length of emoji