fix(runtime-core): normalize function children for elements and Teleport#9108
Conversation
Size ReportBundles
Usages
|
…children are function
61e7a78 to
e12432e
Compare
Element and Teleport children are function
|
Based on the comment on h.ts /*
// type only
h('div')
// type + props
h('div', {})
// type + omit props + children
// Omit props does NOT support named slots
h('div', []) // array
h('div', 'foo') // text
h('div', h('br')) // vnode
h(Component, () => {}) // default slot
// type + props + children
h('div', {}, []) // array
h('div', {}, 'foo') // text
h('div', {}, h('br')) // vnode
h(Component, {}, () => {}) // default slot
h(Component, {}, {}) // named slots
// named slots without props requires explicit `null` to avoid ambiguity
h(Component, null, {})
**/This is working as intended, this PR is requesting to change the API. The only case where we could argue otherwise would be Teleport not supporting the function. If the intention is for functions to be supported across the board |
|
@pikax let tag: string | Component = 'div'
h(tag, {}, () => 'hello world')If we only support |
I'm not saying otherwise, just saying this is a change of the current API, changing API is more cumbersome, there's typescript that needs to be updated which this PR hasn't done it, there's RFC. I would argue logically it makes sense why Element to not support functions, the reason I say that is because functions are a sugar for default slot, but Element doesn't have slots per se, is just children, because |
|
core/packages/runtime-core/src/h.ts Lines 108 to 112 in 2857a59 @pikax I see there are overloads for |
📝 WalkthroughWalkthroughFunction children for element and Teleport vnodes now follow the slot-object normalization path, and the vnode and ChangesFunction children normalization
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Suggested labels
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
@vue/compiler-core
@vue/compiler-dom
@vue/compiler-sfc
@vue/compiler-ssr
@vue/reactivity
@vue/runtime-core
@vue/runtime-dom
@vue/server-renderer
@vue/shared
vue
@vue/compat
commit: |
Element and Teleport children are function|
/ecosystem-ci run |
|
📝 Ran ecosystem CI: Open
|
fixed #9107
When the children of the
ElementorTeleportcomponent are a function, we should execute this function and use its return value as the children.Palyground
Summary by CodeRabbit