混入: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("#元素