生命週期和模板引用 目前為止,Vue 為我們處理了所有的 DOM 更新,這要歸功於響應性和聲明式渲染。然而,有時我們也會不可避免地需要手動操作 DOM。 這時我...
組件 目前為止,我們只使用了單個組件。真正的 Vue 應用往往是由嵌套組件創建的。 父組件可以在模板中渲染另一個組件作為子組件。要使用子組件,我們需要先引入它:...
Emits 除了接收 props,子組件還可以向父組件觸發事件: <script setup> // 聲明觸發的事件 const emit = de...
今天介紹Tamplate其他的語法 除了介紹過的文本插植(Mustache雙大括號)、v-on、v-bind以外還有其他的語法 原始 HTML 雙大括號會將數據...
Tamplate語法 指令 Directives 指令是帶有 v- 前綴的特殊屬性。Vue 提供了許多內置指令,包括上面我們所介紹的 v-bind 和 v-ht...
響應式基礎補充 討論:為何要使用ref()而非普通的變量? 為什麼我們需要使用帶有 .value 的 ref,而不是普通的變量? 當你在模板中使用了一個 ref...
計算屬性(補充) 示例 模板中的表達式雖然方便,但也只能用來做簡單的操作。如果在模板中書寫太多邏輯,會讓模板變得臃腫,難以維護。例如說,我們有這樣一個包含嵌套數...
Class 與 Style 綁定(1) 數據綁定的一個常見需求場景是操縱元素的 CSS class 列表和內聯樣式。因為 class 和 style 都是元素属...
Class 與 Style 綁定(2) 綁定內聯樣式 綁定對象:style 支持綁定 JavaScript 對象值,對應的是 HTML 元素的 style 屬性...
列表渲染(1) v-for 我們可以使用 v-for 指令基於一個數組來渲染一個列表。v-for 指令的值需要使用 item in items 形式的特殊語法,...