vue重點知識總結

Vue實例

每個Vue 實例都會代理其data 物件裡所有的屬性：vm.a===data.a //true

注意只有這些被代理的屬性是回應的。

如果在實例建立之後新增新的屬性到實例上，它不會觸發視圖更新。

除了 data 屬性， Vue 實例揭露了一些有用的實例屬性與方法。這些屬性與方法都有前綴 $，以便與代理的 data 屬性區分。

模板語法

使用v-html裡的{{}}綁定會變成下面的樣子，不會編譯，直接當做字串：

資料綁定使用js表達式

過濾器

computed

Computed vs Methods

計算屬性是基於它們的依賴進行快取的。 計算屬性只有在它的相關依賴改變時才會重新求值。這就意味著只要 message 還沒有改變，多次存取 reversedMessage 計算屬性會立即傳回先前的計算結果，而不必再執行函數。

Computed vs Watched

設定setter

#直接使用fullname就是呼叫getter，給fullname賦值時呼叫的是setter

watch選項
當你想要在資料變化回應時，執行非同步操作或開銷較大的操作，這是很有用的。

在官方的範例中，使用 watch 選項允許我們執行非同步操作（存取一個 API），限制我們執行該操作的頻率，並在我們得到最終結果之前，設定中間狀態。
這是計算屬性無法做到的。

動態綁定class和style以及使用元件時如何添加動態class

#自動添加前綴

當v-bind:style使用需要特定前綴的CSS 屬性時，如transform ，Vue.js 會自動偵測並加入對應的前綴。

條件渲染

#v-else 元素或v-else-if元素必須緊接在v-if或v-else-if 元素的後面——否則它將不會被識別。

用 key 管理可重複使用的元素
Vue 會盡可能有效率地渲染元素，通常會重複使用已有元素而不是從頭開始渲染。

v-show
不同的是帶有 v-show 的元素總是會被渲染並保留在 DOM 中。 v-show 是簡單地切換元素的 CSS 屬性 display 。

注意， v-show 不支援

以上是vue重點知識總結的詳細內容。更多資訊請關注PHP中文網其他相關文章！