【一些概念理解】
vue組件,就是vue將能復用的部分進行封裝
生命周期痊银,一個VUE對象從創(chuàng)建到銷毀的過程(8個過程)
生命周期用來干什么:狀態(tài)監(jiān)控和步驟回調(diào)
當生命周期觸發(fā)了相應的鉤子函數(shù)纵寝,就會調(diào)用到相關(guān)方法執(zhí)行動作;就是進入一個頁面,在這個組件開始創(chuàng)建兽叮、初始化數(shù)據(jù)、編譯猾愿、掛載鹦聪、渲染 、銷毀這些時間點里執(zhí)行動作蒂秘,每個函數(shù)有對應執(zhí)行的時間
掛載:我們把React.js 將組件渲染泽本,并且構(gòu)造 DOM 元素然后塞入頁面的過程稱為組件的掛載
DOM:http://www.reibang.com/p/a469774d819b
【聲明周期過程及應用】
1.beforeCreate(常用):組件創(chuàng)建之前觸發(fā),這時組件還沒創(chuàng)建姻僧,可以在這加載loading動畫
2.created(常用):組件創(chuàng)建完畢规丽,這時組件創(chuàng)建完成,但還沒有掛載撇贺,頁面上沒有展示組件赌莺;可以在這里1)請求后端接口賦給屬性2)結(jié)束loading加載
3.beforeMount:組件掛載之前,編譯并準備掛載松嘶,內(nèi)容還沒渲染到頁面上艘狭,此時頁面上看不到內(nèi)容
4.mounted(常用):組件掛載完畢,DOM生成翠订,可以在這里1)頁面出來之后獲取數(shù)據(jù)巢音,如發(fā)送ajax請求2)配合路由做些控制
5.beforeUpate:組件更新之前
6.upated:組件更新完畢,執(zhí)行完后頁面是更新后的展示效果尽超,組件需要發(fā)生改變一般在這里用
7.beforeDestoy(常用):組件銷毀之前官撼,可以在這里做刪除操作確認
8.destoyed(常用):組件銷毀完畢,當前組件已刪除橙弱,清空相關(guān)初始化內(nèi)容
【mounted和created區(qū)別】
created:組件還沒展示之前需要拿到后端數(shù)據(jù)歧寺??棘脐?
mounted:組件展示之后需要拿到后端數(shù)據(jù)斜筐??蛀缝?
參考:https://www.bilibili.com/video/av88726353/顷链,https://www.bilibili.com/video/av89278053