Vue 是漸進式框架，自底向上增量開發，是構建數據驅動的web界面，他通過盡可能簡單的API實現響應的數據綁定和組合的視圖組件，與angularjs，相比它小巧，運行快數據綁定都使用{{}} ，與react相比都提供了 組件化的試圖組件，都集中在核心庫，有豐富的插件庫。
1. 常用標簽V-model 雙向關聯V-else 與 v-else在上下相近的標簽里使用，分開就會影響條件的判斷V-for （a ， b）in c 遍歷c ，參數a 代表各個對象，b代表索引V- text 想內部注入文本，標簽內部不再寫內容V-html 內部可以注入標簽，但也是黑客突破網絡的窗口V-bind 可以動態的綁定內容 例如v-bind：src=“url” url在下方模塊的data部分寫路徑如果直接寫入路徑會報錯動態的綁定 component 中 ：is=“name”
2、監聽第一種寫法vm.$watch (‘’,function( newvalue , oldvalue){ } )在vm=new vue外部寫的 $watch 是因為在外部調用 ，升成全局 同理 $el第二種寫法直接在vue初始化中通過vue內部寫的watch｛msg:function(newvalue,oldvalue){}3、過濾器（vue 1.0 有內置過濾器 vue2.0 自定義過濾器）filter 是過濾器語法， 寫在 vue前Vue.filter(‘過濾器名字’,function(value){if(value ){return //具體操作}if(value){return //具體操作}})調用{{ 值 | 過濾器名字 }}
4、事件阻止冒泡1）函數內部阻止事件冒泡 e.cancelBubble=true; // 在 vue 的methods 內聲明事件是添加原話2）標簽內阻止事件冒泡 @click.stop=“show1()” //添加一個stop 即可，其他正常寫3）鍵盤事件 keydown 函數中獲取鍵盤編碼keyCode4）在標簽內直接綁定按鍵事件 （英文名或鍵盤碼）@keyup.13=“functionname()” @keyup.enter=“functionname()”
5、生命周期 共11個通俗理解是一個組件之類的加載失效的過程，類比于生命的開始與結束，這些特殊的時間節點被當做事件的觸發條件，省去了綁定事件發生的代碼量。箭頭函數this指向父級 不是實例，所以不能綁定生命周期常用的幾種beforeMount在掛載開始之前被調用Mounted el 被新創建的 vm.$el 替換，并掛載到實例上去之后調用
6、傳值1）父傳子（通過在子組件標簽上綁定自定義屬性式的指令，值為傳遞的數據，子組件內部通過props屬性名接收（數組形式 加引號【“ name”】），子組件的模板內，直接解析加載接收的屬性名。）



調用

2）子傳父（通過在 子組件標簽上綁定自定義事件，子組件內部通過$emit進行數據推送父組件通過事件調用函數參數進行數據接收）子組件script中

父組件body中

父組件的方法中將收到的數據賦予data

3）平行組件傳值（非父子組件 之間 傳值—空vue對象$emit(‘’,數據) 發送 $on 接收）可看做將$emit升為全局

總結

以上是生活随笔為你收集整理的HTML5前端知识分享：Vue入门的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。