var vm = new Vue({
    el: "#container",
    data: {
        test : 'hello world'
    },
    beforeCreate: function(){
        console.log(this);
        showData('建立vue例項前',this);
    },
    created: function(){
        showData('建立vue例項後',this);
    },
    beforeMount:function(){
        showData(
 
'掛載到dom前',this);
    },
    mounted: function(){
        showData('掛載到dom後',this);
    },
    beforeUpdate:function(){
        showData('資料變化更新前',this);
    },
    updated:function(){
        showData('資料變化更新後',this);
    },
    beforeDestroy:function(){
        vm.test ="3333";
        showData('vue例項銷燬前',this
 
);
    },
    destroyed:function(){
        showData('vue例項銷燬後',this);
    }

});

function realDom(){
    console.log('真實dom結構：' + document.getElementById('container').innerHTML);
}
function showData(process,obj){
    console.log(process);
     console.log('data 資料：' + obj.test)
     console.log('掛載的物件：')
     console.log(obj.$el)
     realDom();
     console.log(
 
'------------------')
     console.log('------------------')
}