vue中mixin 混入

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/adley_app/article/details/87862271

  <div id="app">
       <p>num:{{ num }}</p>
       <P><button @click="add">增加数量</button></P>
   </div>

  <script src="./node_modules/vue/dist/vue.js" charset="utf-8"></script>
  <script>

      var addLog={
          updated(){
              console.log("数据放生变化,变化成"+this.num);
          }
      }

      Vue.mixin({
        updated(){
            console.log('这是全局混入的方法。。。');
        }
      })

        var app=new Vue({
            el:'#app',
            data:{
                num:1
            },
            methods:{
                add:function(){
                    this.num++;
                }
            },
            updated(){
              console.log('这是组件 。。。。');
            },
            mixins:[addLog]
        })
  </script>

执行顺序： 全局 --》 mixin --》组件

这是全局混入的方法。。。
mix.html:21 数据放生变化,变化成2
mix.html:42 这是组件 。。。。