vue.js 混入

混入：mixins

一种分发Vue组件中可反复使用的功能的方法。

混入对象可以：包含任意组件选项。

混入对象的选项将被混入该组件本身的选项。

• 如果有同名选项，在和组件的数据发生冲突时，组件数据优先。混入数据被丢弃。

全局混入：Vue.minin({...})  ⚠️谨慎使用。

会影响到每个单独创建的Vue实例。

// 为自定义的选项 'myOption' 注入一个处理器。
// created是实例初始化后的钩子：
Vue.mixin({
  created: function () {
    var myOption = this.$options.myOption 　　#$options得到所有选项。
    if (myOption) {
      console.log(myOption)
    }
  }
})

new Vue({
  myOption: 'hello!'　　　　　　# 这是给实例的自定义属性

})
// => "hello!

选项／组合

mixins: [object]

接受一个混入对象的数组。

比如声明一个变量hook，这个变量是一个钩子方法。通过minins: [hook], 可以把这个变量hook放入new Vue({})中。

extends：Object | Function

用于声明扩展另一个组件。无需使用Vue.extend。主要为了方便扩展单文件组件xxx.vue

例子：

var CompA = { ... } 　　　　#一个对象

var CompB = { 　　　　　　#在没有调用 Vue.extends的时候继承 CompA

extends: CompA, ...

}

---

全局API

Vue.extend(options)，

用基础构造器，创建一个‘子类’。这个类被实例化后就是一个Vue实例。但没有挂载.

options是 {object}, 组件选项

• data: function() {  return ... }
• template: '<p>...</p>'

例子：

var Profile = Vue.extend({ ...})  　　#创建构造器

new Profile().$mount("#元素