Vue_钩子函数

Posted 2020-12-13 wangdianchao

        <script type="text/javascript">
            var vm = new Vue({
                el: app01,
                data:{
                    a:‘test‘,
                },
                beforeCreate:function(){
                    console.log(‘实例创建之前‘);
                },
                created:function(){
                    console.log(‘实例创建之后‘);
                },
                beforeMount:function(){
                    console.log(‘再挂载开始之前被调用，相关的渲染函数首次被调用‘);
                },
                mounted:function(){
                    console.log(‘el被新创建的vm.$el替换，挂在成功‘);
                },
                beforeUpdate:function(){
                    console.log(‘数据更新时调用‘);
                },
                updated:function(){
                    console.log(‘组件DOM已经更新，组件跟新完毕时调用‘);
                }
            }
            setTimeout(function(){
                vm.a = ‘3秒后数据改变‘
            }, 3000)
        </script>

结果：