1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<template>
<div class="layout">
<Header />
<router-view />
<Footer />
</div>
</template>
<script>
import Header from "./header.vue";
import Footer from "./footer.vue";
export default {
name: "layout",
components: { Header, Footer },
directives: {},
filters: {},
extends: {},
mixins: {},
props: {},
data() {
return {};
},
computed: {},
watch: {},
beforeCreate() {
// 生命周期钩子：组件实例刚被创建，组件属性计算之前，如 data 属性等
},
created() {
// 生命周期钩子：组件实例创建完成，属性已绑定，但 DOM 还未生成，el 属性还不存在
// 初始化渲染页面
},
beforeMount() {
// 生命周期钩子：模板编译/挂载之前
},
mounted() {
// 生命周期钩子：模板编译、挂载之后（此时不保证已在 document 中）
},
beforeUpate() {
// 生命周期钩子：组件更新之前
},
updated() {
// 生命周期钩子：组件更新之后
},
activated() {
// 生命周期钩子：keep-alive 组件激活时调用
},
deactivated() {
// 生命周期钩子：keep-alive 组件停用时调用
},
beforeDestroy() {
// 生命周期钩子：实例销毁前调用
},
destroyed() {
// 生命周期钩子：实例销毁后调用
},
errorCaptured(err, vm, info) {
// 生命周期钩子：当捕获一个来自子孙组件的错误时被调用。此钩子会收到三个参数：错误对象、发生错误的组件实例以及一个包含错误来源信息的字符串。
console.log(err, vm, info);
},
methods: {},
};
</script>
<style lang="scss" scoped></style>