現在公司選型沒有用到vue,但是上家公司準備要用。把自己的一些筆記放到這里,正好跟人知識共享,又復習了自己的vue~(希望大佬能多多指點指點)
1、初識Vue
Vue.js 不支持 IE8 及其以下版本,因為 Vue.js 使用了 IE8 不能模擬的 ECMAScript 5 特性。
Vue.js 支持所有兼容 ECMAScript 5 的瀏覽器。
下載完vue.js 控制臺輸入Vue測試成功否
獨立構建和運行時構建
獨立構建:上線的時候用bablue翻譯
運行時構建:一起打包上線然后適時監控,但是占用空間很大。
vue構建項目不用webpack了 因為有了vue.cli。
2、Vue常用指令
v-:指令
{{}}:叫做插值表達式
v-text=“” 和{{}}插值一樣
v-bind: (:)可以尋找下面的變量
v-if=“true” 直接影響dom節點是否存在 false則標簽不再存在 直接刪除了
v-show=“seen” seen是展示,false是不展示 但是節點還在 相當于隱藏
v-for=""? 循環
v-on:click? (@click) 監聽的事件名字
v-model=“”? 雙向綁定
v-once: 限制,只有第一次綁定的時候顯示值, 然后就不變了
v-html: 顯示內容中去除標簽
methods:要添加的事件
class 和 style 都用 v-bind:
修飾符
.prevent 阻止默認行為 (methods里面就是event.preventDefault())
.stop? ? ? 阻止冒泡
過濾器(管道命令)
前邊是個變量
后面那是過濾器的名稱
date.now不是一個內部依賴
todolist
app是實例
el:"#root" = app.$mount("root")
watch 監聽message的變化 es6 里面如果用this,this指向的是data
3、Vue父子組件傳值
子組件
父組件
4、Vue生命周期
在頁面生命周期的某一個點上執行某一個函數,叫做鉤子。
beforeCreate? 創建虛擬dom之前執行的
create? ? ? ? 創建虛擬dom之后執行的
bofoereMount? 掛載,渲染dom之前執行的
mounted? ? ? 掛載完,頁面渲染之后執行的
beforeUpdate? 數據改變的時候執行
updated? ? ? 數據改變的時候執行
beforeDestroy 當你要銷毀這個實例的時候執行 app.$destroy()
destroyed? ? 當你要銷毀這個實例的時候執行 app.$destroy()
5、Vue數組方法
變異方法指的的是原數組進行改變
非變異方法是指不改變原數組
6、Vue組件
子組件:定義一個變量 然后用compinents接收定義(標簽名:變量名)
用變量定義的局部組件
用Vue.component定義的全局組件
雙向綁定
響應式原理
異步更新隊列
當點擊的時候對show取反
暫時就總結到這里,會不斷學習的。希望能幫助到別人。
推廣一下自己的小程序,如果你也喜歡鍛煉的話在這里尋找你的小伙伴吧。
公眾號入口,關注其實不太胖,點擊匯鍛煉即可。一只喜歡鍛煉的程序猿,嘿嘿。