生命周期

2018-09-23  本文已影响0人  大宝贝_4c6e

1、什么是生命周期

每个 Vue 实例在被创建时都要经过一系列的初始化过程,这个过程就叫做生命周期。

生命周期图示: 13987241-a9969bea45b5a089.png

2、模拟实例:


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
   <div id='app'>{{msg}}</div>
    <script src='js/vue.js'></script>
    <script>
       new Vue({
           el:'#app',
           data:{
               msg:'hello vue'
           },
           beforeCreate:function(){
               alert('beforeCreated');
           },
           created:function(){
               alert('created')
           },
           beforeMount:function(){
                 alert('beforMount')
           },
           mounted:function(){
               alert('mounted')
           }
       })
    </script>
</body>
</html>
运行结果为:
13997532-15ecb162c60dbc73.png
13997532-8b45841f8208f897.png
13997532-24995585550711b0.png
13997532-52c3506d7a21896a.png
13997532-a9e737fe90695921.png
上一篇 下一篇

猜你喜欢

热点阅读