Web/21-Vue基础/03-Vue的生命周期函数.md
2018-04-20 23:44:34 +08:00

887 B

Vue 2.0的生命周期函数

20180420_2305.png

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="vue2.5.16.js"></script>
</head>

<body>
    <!--这个div区域就是MVVM中的 View-->
    <div id="app">
    </div>
</body>

<script>
    new Vue({
        el: '#app',
        data: {
            msg: 'hello vuejs'
        },
        beforeCreate: function () {
            console.log('1.0 beforeCreate', this.msg);
        }
        ,
        created: function () {
            console.log('2.0 created', this.msg);
        }
        ,
        beforeMount: function () {
            console.log('3.0 beforeMount', this.msg);
        }
        ,
        mounted: function () {
            console.log('4.0 mounted', this.msg);
        }
    });

</script>

</html>

打印结果:

20180420_2302.png