每個Vue 實例都會代理其data 物件裡所有的屬性:vm.a===data.a //true
注意只有這些被代理的屬性是回應的。
如果在實例建立之後新增新的屬性到實例上,它不會觸發視圖更新。
除了 data 屬性, Vue 實例揭露了一些有用的實例屬性與方法。這些屬性與方法都有前綴 $,以便與代理的 data 屬性區分。
使用v-html裡的{{}}綁定會變成下面的樣子,不會編譯,直接當做字串:
資料綁定使用js表達式
過濾器
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中文網其他相關文章!