生命周期鈎子

beforeCreate / created

beforeMount / mounted

beforeUpdate / updated

beforeDestroy / destroyed

文本

經由過程運用 v-once 指令，能夠實行一次性地插值，當數據轉變時，插值處的內容不會更新。但這會影響到該節點上的別的數據綁定：

<span v-once>這個將不會轉變: {{ msg }}</span>

v-html

站點上動態襯着的恣意 HTML 可能會異常風險，由於它很輕易致使 XSS 進擊。只能對可托內容運用 HTML 插值，毫不要對用戶供應的內容運用插值。

屬性

屬性、盤算屬性、過濾器

<div class="app">
    {{ a }} --- {{ addA }} --- {{ a | filterA }}
</div>
    <script>
        let vm = new Vue({
            el:'.app',
            data:{// 屬性
                a:10
            },
            computed:{// 盤算屬性
             addA(){
                 return this.a + 10;
             }
            },
            filters:{// 過濾器
                filterA(data){
                    return data + 100;
                }
            }
        })
    </script>

watch監聽屬性

視察和相應 Vue 實例上的數據更改：偵聽屬性。

key

為了給 Vue 一個提醒，以便它能跟蹤每一個節點的身份，從而重用和從新排序現有元素，需要為每項供應一個唯一 key 屬性。抱負的 key 值是每項都有的且唯一的 id。能夠運用 v-bind 來綁定動態值key

<div v-for="item in items" :key="item.id">
  <!-- 內容 -->
</div>