生命周期函数：
组件挂载，以及组件更新，组建销毁的时候出发的一系列方法。
beforeCreate：实例创建之前
created：实例创建完成
beforeMount：模板编译之前
mounted：模板编译完成。请求数据，操作dom放在这
beforeUpdate：数据更新之前
updated：数据更新完毕
beforeDestory：实例销毁之前。页面销毁的时候保存一些数据
destoryed：实例销毁完成
示例代码：
App.vue
<template>
<div id="app">
<v-home v-if="flag"></v-home>
<button @click="flag=!flag">更改v-home展示</button>
</div>
</template> <script>
import Home from "./components/Home.vue";
export default {
name: "app",
data() {
return {
flag: true
};
},
components: {
"v-home": Home
}
};
</script> <style lang="scss">
</style>
components/Home.vue
<template>
<div>
{{title}}
<input v-model="title"/>
</div>
</template>
<script>
export default {
data() {
return {
title: "我是Home组件"
};
},
beforeCreate() {
console.log("实例创建之前");
},
created() {
console.log("实例创建完成");
},
beforeMount() {
console.log("模板编译之前");
},
mounted() {
console.log("模板编译完成");
},
beforeUpdate() {
console.log("数据更新之前");
},
updated() {
console.log("数据更新完毕");
},
beforeDestroy() {
console.log("实例销毁之前");
},
destroyed() {
console.log("实例销毁完成");
}
};
</script>
<style>
</style>