h() Create Virtual Nodes
Last updated: 2026-10-22
h() Create Virtual Nodes
h() creates virtual nodes (VNodes) — the primitive under render functions and JSX.
| Group | Render Functions & SSR |
|---|---|
| Kind | API |
| Scope | Component |
| Vue Version | 3.0+ |
| SSR Support | Yes |
📝 Syntax
h("div", { class: "box" }, "content")
h(MyComp, { msg: "hi" }, { default: () => "slot" })⚙️ Arguments
| type, props?, children? | type (tag or component), optional props, children (string, array or slots) |
|---|
Returns：A VNode
▶ Example
Edit the code below and see the live result:
Output：
Renders a three-item list.💡 Key Points
ℹ️ Note Templates compile to h() calls.
💡 Tip Reserve manual h() for programmatic structures.
⚠️ Warning Tag names are case-sensitive.
🏷️ Related Render Functions & SSR
💡 Related Cases
More case studies coming soon.
📚 Related Tutorials
❓ FAQ
Q h or JSX?
A JSX reads better with a build step; h needs none.
Q How are slots passed?
A Pass an object of slot functions as children.
Q Must it be imported?
A Import it, or use Vue.h in CDN pages.
