Vue框架学习笔记

Vue生命周期钩子

beforeCreate

created

beforeMount

mounted

beforeUpdate

updated

beforeDestory

destroyed

Vue框架学习笔记

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>生命周期钩子实例</title>
    <script src="vue.js" type="text/javascript" charset="UTF-8"></script>
</head>
<body>
    <div id="app7">
        {{msg}}
    </div>

    <script type="text/javascript">
        var LC = new Vue({
            el: '#app7',
            data: {
                msg: "hi,Csq",
            },

            beforeCreate:function () {
                console.log("beforeCreate");
            },

            created:function () {
                console.log("created");
            },

            beforeMount:function () {
                console.log("beforeMount");
            },

            mounted:function () {
                console.log("mounted");
            },

            beforeUpdate:function () {
                console.log("beforeUpdate");
            },

            updated:function () {
                console.log(updated);
            },

            beforeDestroy:function () {
                console.log("beforeDestroy");
            },

            destroyed:function () {
                console.log("destroyed");
            }
            
            
        })
    </script>
</body>
</html>