Vue Mixins 混入选项Vue Mixins 混入选项 ``` Vue Mixins 混入选项不污染原始的样子来

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Vue Mixins 混入选项</title>
    <script type="text/javascript" src="../assets/js/vue.js"></script>
</head>
<body>
<h1>Vue Mixins 混入选项</h1>
<p>不污染原始的样子来混入到项目中去</p>
<hr>
<div id="app">
    <p>
        {{num}}
    </p>
    <p><button @click="add">add</button></p>
</div>
</body>
</html>
<script>
    var addConsole={
        //钩子方法
        updated:function () {
            console.log('数据发生变化'+this.num)
        }
    };
    //全局的API混入
    Vue.mixin({
        updated:function(){
            console.log('我是全局的混入')
        }
    });
    var app = new Vue({
        el:'#app',
        data:{
            num:1
        },
        updated:function(){
            console.log('我是构造器触发的')
        },
        methods:{
            add:function(){
                this.num++
            }
        },
        //混入
        mixins:[addConsole]
    })
</script>