在这里插入代码片
<template>
<div class="main" ref="main">
<!--
vue-baidu-map
-->
<!--
钩子函数
-->
</div>
</template>
<script>
export default {
/* 八个钩子函数 */
beforeCreate() {
/* 在vue实例创建后 触发的 这个时候还没有进行data里的数据监听 和 事件的初始化 */
},
created() {
/* 实例被创建之后 完成调用 能拿到数据 可以修改数据
可以在这个钩子函数中发送请求 访问后端拿数据 */
},
beforeMount() {
/*真实的dom节点挂载到页面之前 */
},
mounted() {
/*真实的dom节点挂载到页面上 可以访问数据和更改数据 */
},
beforeUpdate() {
// 修改值之前调用
},
updated() {
/* 修改之后调用
beforeUpdate updated可以监控data里
所有的数据变化*/
},
beforeDestroy() {
/* 实例卸载之前进行调用 */
},
destroyed() {
},
activated() {
/* keep-alive 缓存组件的时候调用 */
},
deactivated() {
/* 缓存组件被卸载的时候调用 */
},
watch: {
/* 监听特定值的变化
监听路由参数的变化
不能使用函数的形式监听对象的变化 需要深度监听 立即监听
*/
},
/* */
name: "helloEcharts",
data() {
return {
}
},
watch: {
},
mounted() {
},
methods: {
},
}
</script>
<style scoped>
.main {
height: 500px;
width: 500px;
margin: 100px auto;
}
</style>
vue 生命周期钩子函数 和 watch activated deactivated
最新推荐文章于 2024-07-29 21:06:22 发布