Vue的混合继承详解

// 创建构造器ja
var Profile = Vue.extend({
  template: '<p>{{firstName}} {{lastName}} aka {{alias}}</p>',
  data: function () {
    return {
      firstName: 'Walter',
      lastName: 'White',
      alias: 'Heisenberg'
    }
  }
})
// 创建 Profile类的实例，并挂载到一个元素上。
new Profile().$mount('#mount-point')

<template>
    <div>
        <h3>Page Two</h3>
        <paging :total="total" :pageSize="pageSize" :sizeOptions="sizeOptions"/>
    </div>
</template>
<script>
    import PagingData from '../component/PagingData.vue'
    export default {
        // 实现继承
        extends: PagingData
    }
</script>

<template>
    <div>
        <h3>Page One</h3>
        <hr/>
        <paging @pageChangeEvt="cb" :total="total" :pageSize="pageSize" :sizeOptions="sizeOptions"/>
    </div>
</template>
<script>
    import PagingData from '../component/PagingData.vue'
    import PagingFunc from '../component/PagingFunc'
    export default {
        // extends: {PagingFunc, PagingData},
        // extends: [PagingFunc, PagingData],
        mixins: [PagingFunc, PagingData],
    }
</script>