Comprehensive Guide to Vue Component Writing Styles: Options API, Composition API, Setup Syntax Sugar, Render Functions, and JSX

This article systematically introduces the many ways to write Vue components—including the classic Options API, the modern Composition API with setup syntax sugar, hand‑written render functions using h or createVNode, and various JSX techniques—explaining their principles, code examples, and when to choose each approach.

ComponentJSXJavaScript

0 likes · 19 min read

Comprehensive Guide to Vue Component Writing Styles: Options API, Composition API, Setup Syntax Sugar, Render Functions, and JSX

Rare Earth Juejin Tech Community

Feb 4, 2024 · Frontend Development

Understanding Vue Form Validation, Scoped Data Attributes, Build Output, Remote Component Loading, and Render‑Function Dropdown

This article explains the principles and implementation details of Vue form validation, the generation of scoped data‑v‑xxx attributes, the composition of build output files, remote loading of .vue components, and how to create a dropdown menu using the render function, providing code examples and step‑by‑step explanations.

Dynamic ComponentScoped CSSVite

0 likes · 17 min read

Understanding Vue Form Validation, Scoped Data Attributes, Build Output, Remote Component Loading, and Render‑Function Dropdown

WecTeam

Aug 27, 2020 · Frontend Development

How to Reconstruct Vue Templates from Compiled JavaScript

This article explains how Vue single‑file components are compiled into render functions and staticRenderFns, and provides a step‑by‑step method to reverse‑engineer the compiled JavaScript back into the original template, style, and script sections using AST parsing, transformation, and code generation techniques.

ASTVuefrontend

0 likes · 29 min read

How to Reconstruct Vue Templates from Compiled JavaScript

Xueersi Online School Tech Team

Apr 10, 2020 · Frontend Development

Understanding Vue's Virtual DOM: VNode Creation, Rendering Flow, and Core Utilities

This article explains how Vue 2 implements a virtual DOM by describing the structure of VNode objects, the render function, the createElement process, and the normalization utilities, providing detailed code examples and step‑by‑step analysis of the rendering pipeline.

JavaScriptVirtual DOMVue

0 likes · 14 min read

Understanding Vue's Virtual DOM: VNode Creation, Rendering Flow, and Core Utilities