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): improve v-model binding sync between vue wrappers and web components (#22745)

Browse Source 
resolves #22731
This commit is contained in:
Liam DeBeasi
2021-01-08 12:06:45 -05:00
committed by GitHub
parent 3d6ac1382e
commit 64719f49f9
3 changed files with 12 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@ -48,13 +48,15 @@ export const defineContainer = <Props>(name: string, componentProps: string[] =
* They refer to whatever properties are set on an instance of a component.
*/
const Container = defineComponent<Props & InputProps>((props, { attrs, slots, emit }) => {
let modelPropValue = (props as any)[modelProp];
const containerRef = ref<HTMLElement>();
const classes = new Set(getComponentClasses(attrs.class));
const onVnodeBeforeMount = (vnode: VNode) => {
// Add a listener to tell Vue to update the v-model
if (vnode.el) {
vnode.el.addEventListener(modelUpdateEvent.toLowerCase(), (e: Event) => {
emit(UPDATE_VALUE_EVENT, (e?.target as any)[modelProp]);
modelPropValue = (e?.target as any)[modelProp];
emit(UPDATE_VALUE_EVENT, modelPropValue);
});
}
};
@ -105,7 +107,7 @@ export const defineContainer = <Props>(name: string, componentProps: string[] =
if (modelProp) {
propsToAdd = {
...propsToAdd,
[modelProp]: props.hasOwnProperty('modelValue') ? props.modelValue : (props as any)[modelProp]
[modelProp]: props.hasOwnProperty('modelValue') ? props.modelValue : modelPropValue
}
}