Skip to content

Commit

Permalink
fix(vue): fix render loop cause by functional component in mapProps (#…
Browse files Browse the repository at this point in the history
…3070)

* fix(vue): fix render loop cause by functional component in mapProps

* fix(vue): fix type error
  • Loading branch information
MisicDemone committed Apr 25, 2022
1 parent 1a965c0 commit 0d15fe9
Showing 1 changed file with 17 additions and 38 deletions.
55 changes: 17 additions & 38 deletions packages/vue/src/shared/connect.ts
Expand Up @@ -36,48 +36,27 @@ export function mapProps<T extends VueComponent = VueComponent>(
}, input)

return (target: T) => {
/* istanbul ignore else */
if (isVue2) {
return defineComponent<VueComponentProps<T>>({
functional: true,
return observer(
defineComponent({
name: target.name ? `Connected${target.name}` : `ConnectedComponent`,
render(createElement, context) {
setup(props, { attrs, slots, listeners }: any) {
const fieldRef = useField()
const { data } = context
const attrs = fieldRef.value
? transform(
{ ...data.attrs, ...data.props } as VueComponentProps<T>,
fieldRef.value
)
: { ...data.attrs, ...data.props }
return createElement(target, { ...data, attrs }, context.children)
return () => {
const newAttrs = fieldRef.value
? transform({ ...attrs } as VueComponentProps<T>, fieldRef.value)
: { ...attrs }
return h(
target,
{
attrs: newAttrs,
on: listeners,
},
slots
)
}
},
})
} else {
return observer(
defineComponent({
name: target.name ? `Connected${target.name}` : `ConnectedComponent`,
setup(props, { attrs, slots }) {
const fieldRef = useField()
return () => {
const newAttrs = fieldRef.value
? transform(
{ ...attrs } as VueComponentProps<T>,
fieldRef.value
)
: { ...attrs }
return h(
target,
{
attrs: newAttrs,
},
slots
)
}
},
})
)
}
)
}
}

Expand Down

0 comments on commit 0d15fe9

Please sign in to comment.