fix(core): updating type of input value to accept numbers, fixes #20173 (#20267)

This commit is contained in:
Ely Lucas
2020-01-23 11:15:22 -07:00
parent 5d8e0ed703
commit 3a56228290
4 changed files with 8 additions and 7 deletions

View File

@ -435,7 +435,7 @@ ion-input,prop,size,number | undefined,undefined,false,false
ion-input,prop,spellcheck,boolean,false,false,false ion-input,prop,spellcheck,boolean,false,false,false
ion-input,prop,step,string | undefined,undefined,false,false ion-input,prop,step,string | undefined,undefined,false,false
ion-input,prop,type,"date" | "email" | "number" | "password" | "search" | "tel" | "text" | "time" | "url",'text',false,false ion-input,prop,type,"date" | "email" | "number" | "password" | "search" | "tel" | "text" | "time" | "url",'text',false,false
ion-input,prop,value,null | string | undefined,'',false,false ion-input,prop,value,null | number | string | undefined,'',false,false
ion-input,method,getInputElement,getInputElement() => Promise<HTMLInputElement> ion-input,method,getInputElement,getInputElement() => Promise<HTMLInputElement>
ion-input,method,setFocus,setFocus() => Promise<void> ion-input,method,setFocus,setFocus() => Promise<void>
ion-input,event,ionBlur,void,true ion-input,event,ionBlur,void,true

View File

@ -978,7 +978,7 @@ export namespace Components {
/** /**
* The value of the input. * The value of the input.
*/ */
'value'?: string | null; 'value'?: string | number | null;
} }
interface IonItem { interface IonItem {
/** /**
@ -4232,7 +4232,7 @@ declare namespace LocalJSX {
/** /**
* The value of the input. * The value of the input.
*/ */
'value'?: string | null; 'value'?: string | number | null;
} }
interface IonItem { interface IonItem {
/** /**

View File

@ -169,7 +169,7 @@ export class Input implements ComponentInterface {
/** /**
* The value of the input. * The value of the input.
*/ */
@Prop({ mutable: true }) value?: string | null = ''; @Prop({ mutable: true }) value?: string | number | null = '';
/** /**
* Update the native input element when the value changes * Update the native input element when the value changes
@ -177,7 +177,7 @@ export class Input implements ComponentInterface {
@Watch('value') @Watch('value')
protected valueChanged() { protected valueChanged() {
this.emitStyle(); this.emitStyle();
this.ionChange.emit({ value: this.value }); this.ionChange.emit({ value: this.value == null ? this.value : this.value.toString() });
} }
/** /**
@ -263,7 +263,8 @@ export class Input implements ComponentInterface {
} }
private getValue(): string { private getValue(): string {
return this.value || ''; return typeof this.value === 'number' ? this.value.toString() :
(this.value || '').toString();
} }
private emitStyle() { private emitStyle() {

View File

@ -238,7 +238,7 @@ export const InputExample: React.FC = () => (
| `spellcheck` | `spellcheck` | If `true`, the element will have its spelling and grammar checked. | `boolean` | `false` | | `spellcheck` | `spellcheck` | If `true`, the element will have its spelling and grammar checked. | `boolean` | `false` |
| `step` | `step` | Works with the min and max attributes to limit the increments at which a value can be set. Possible values are: `"any"` or a positive floating point number. | `string \| undefined` | `undefined` | | `step` | `step` | Works with the min and max attributes to limit the increments at which a value can be set. Possible values are: `"any"` or a positive floating point number. | `string \| undefined` | `undefined` |
| `type` | `type` | The type of control to display. The default type is text. | `"date" \| "email" \| "number" \| "password" \| "search" \| "tel" \| "text" \| "time" \| "url"` | `'text'` | | `type` | `type` | The type of control to display. The default type is text. | `"date" \| "email" \| "number" \| "password" \| "search" \| "tel" \| "text" \| "time" \| "url"` | `'text'` |
| `value` | `value` | The value of the input. | `null \| string \| undefined` | `''` | | `value` | `value` | The value of the input. | `null \| number \| string \| undefined` | `''` |
## Events ## Events