javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-16 01:52:19 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(vue): input v-model accepts numbers (#25666)

Browse Source 
Resolves #25575
This commit is contained in:
Sean Perkins
2022-07-21 16:14:42 -04:00
committed by GitHub
parent 8bb920f85b
commit ab65e9a7b5
3 changed files with 13 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
core/package-lock.json generated
View File

@ -25,7 +25,7 @@
"@stencil/angular-output-target": "^0.4.0",
"@stencil/react-output-target": "^0.2.1",
"@stencil/sass": "^1.5.2",
"@stencil/vue-output-target": "^0.6.1",
"@stencil/vue-output-target": "^0.6.2",
"@types/jest": "^26.0.20",
"@types/node": "^14.6.0",
"@types/swiper": "5.4.0",
@ -1839,9 +1839,9 @@
}
},
"node_modules/@stencil/vue-output-target": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.6.1.tgz",
"integrity": "sha512-JGyl3Bi2NJRDz64c2lFAP6zdRwMD12ruWcbT75VdcLVDmCwo+wqWs/Shj4ZWXlcNhzjxbf9vydtQFwVMld/NrA==",
"version": "0.6.2",
"resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.6.2.tgz",
"integrity": "sha512-Oh7SLFbOUchCSCbGe/Dqal2xSYPKCFQiVKnvzvS0dsHP/XS7rfHqp3qptW6JCp9lBoo3wmmBurHfldqxhLlnag==",
"dev": true,
"peerDependencies": {
"@stencil/core": "^2.9.0"
@ -15570,9 +15570,9 @@
"dev": true
},
"@stencil/vue-output-target": {
"version": "0.6.1",
"resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.6.1.tgz",
"integrity": "sha512-JGyl3Bi2NJRDz64c2lFAP6zdRwMD12ruWcbT75VdcLVDmCwo+wqWs/Shj4ZWXlcNhzjxbf9vydtQFwVMld/NrA==",
"version": "0.6.2",
"resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.6.2.tgz",
"integrity": "sha512-Oh7SLFbOUchCSCbGe/Dqal2xSYPKCFQiVKnvzvS0dsHP/XS7rfHqp3qptW6JCp9lBoo3wmmBurHfldqxhLlnag==",
"dev": true
},
"@stylelint/postcss-css-in-js": {

2
core/package.json
View File

@ -47,7 +47,7 @@
"@stencil/angular-output-target": "^0.4.0",
"@stencil/react-output-target": "^0.2.1",
"@stencil/sass": "^1.5.2",
"@stencil/vue-output-target": "^0.6.1",
"@stencil/vue-output-target": "^0.6.2",
"@types/jest": "^26.0.20",
"@types/node": "^14.6.0",
"@types/swiper": "5.4.0",

10
packages/vue/src/vue-component-lib/utils.ts
View File

@ -1,7 +1,7 @@
import { VNode, defineComponent, getCurrentInstance, h, inject, ref, Ref } from 'vue';
export interface InputProps {
modelValue?: string | boolean;
export interface InputProps<T> {
modelValue?: T;
}
const UPDATE_VALUE_EVENT = 'update:modelValue';
@ -49,7 +49,7 @@ const getElementClasses = (ref: Ref<HTMLElement | undefined>, componentClasses:
* @prop externalModelUpdateEvent - The external event to fire from your Vue component when modelUpdateEvent fires. This is used for ensuring that v-model references have been
* correctly updated when a user's event callback fires.
*/
export const defineContainer = <Props>(
export const defineContainer = <Props, VModelType=string|number|boolean>(
name: string,
defineCustomElement: any,
componentProps: string[] = [],
@ -67,7 +67,7 @@ export const defineContainer = <Props>(
defineCustomElement();
}
const Container = defineComponent<Props & InputProps>((props: any, { attrs, slots, emit }) => {
const Container = defineComponent<Props & InputProps<VModelType>>((props: any, { attrs, slots, emit }) => {
let modelPropValue = props[modelProp];
const containerRef = ref<HTMLElement>();
const classes = new Set(getComponentClasses(attrs.class));
@ -76,7 +76,7 @@ export const defineContainer = <Props>(
if (vnode.el) {
const eventsNames = Array.isArray(modelUpdateEvent) ? modelUpdateEvent : [modelUpdateEvent];
eventsNames.forEach((eventName: string) => {
vnode.el.addEventListener(eventName.toLowerCase(), (e: Event) => {
vnode.el!.addEventListener(eventName.toLowerCase(), (e: Event) => {
modelPropValue = (e?.target as any)[modelProp];
emit(UPDATE_VALUE_EVENT, modelPropValue);