created：html加載完成之前，執(zhí)行。執(zhí)行順序：父組件-子組件

mounted：html加載完成后執(zhí)行。執(zhí)行順序：子組件-父組件

methods：事件方法執(zhí)行

watch：watch是去監(jiān)聽一個值的變化，然后執(zhí)行相對應的函數(shù)。

computed：computed是計算屬性，也就是依賴其它的屬性計算所得出最后的值

export default { name: 'draw', data(){ // 定義變量sourcereturn { source:new ol.source.Vector({wrapX: false}), } }, props:{ //接收父組件傳遞過來的參數(shù) map:{ //type:String }, },mounted(){ //頁面初始化方法 if (map==map){ } var vector = new ol.layer.Vector({ source: this.source }); this.map.addLayer(vector); }, watch: { //監(jiān)聽值變化：map值 map:function () { console.log(’3333’+this.map); //return this.map console.log(’444444’+this.map); var vector = new ol.layer.Vector({ source: this.source }); this.map.addLayer(vector); } }, methods:{ //監(jiān)聽方法 click事件等，執(zhí)行drawFeatures方法 drawFeatures:function(drawType){}}

補充知識：vue中在mounted中window.onresize不生效

在vue開發(fā)中，因為引用的父組件和子組件都使用了window.onresize以至于一個window.onresize失效。

解決方案==>可以采用下面的方式

window.onresize = () => this.screenWidth = window.innerWidth // 改為以下寫法window.addEventListener(’resize’, () => this.screenWidth = window.innerWidth, false)

以上這篇在vue中created、mounted等方法使用小結就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持好吧啦網(wǎng)。