mixins and extends

mixins

使用mixins属性，将混合对象合并进入当前组件。-> 本质上mixins数组的对象的选项，会在执行Vue.extends()方法时进行逻辑合并；

即可按照mixin对象数组进行定制组件。

var mixin = {
  created: function () { console.log(1) }
}
var vm = new Vue({
  created: function () { console.log(2) },
  mixins: [mixin]
})
// -> 1
// -> 2

extends

声明扩展另一个组件（对象），得到新组件（对象）。

即可按照extends属性的组件进行定制组件。

var CustomizeAutoComplete = {
  extends: ELEMENT.Autocomplete,
  methods: {
    handleBlur() {
      console.info('覆盖Autocomplete组件中的handleBlur方法')
    }
  }
}

var Main = {
  template: `
    <el-card>
        请更新 Vue 和 Element 的版本号34
      <customize-auto-complete />
    </el-card>
  `,
  components: {
    'customize-auto-complete': CustomizeAutoComplete,
  }
}

new Vue({
  el: '#app',
  render: h => h(Main)
})