选项/组合
parent
类型:Vue instance
指定已创建的实例之父实例,在两者之间建立父子关系。子实例可以用 this.$parent 访问父实例,子实例被推入父实例的 $children 数组中。
节制地使用 $parent 和 $children - 它们的主要目的是作为访问组件的应急方法。更推荐用 props 和 events 实现父子组件通信
mixin
mixins 选项接受一个混合对象的数组。这些混合实例对象可以像正常的实例对象一样包含选项,他们将在 Vue.extend() 里最终选择使用相同的选项合并逻辑合并。举例:如果你混合包含一个钩子而创建组件本身也有一个,两个函数将被调用。
Mixin 钩子按照传入顺序依次调用,并在调用组件自身的钩子之前被调用。
var mixin = {
created: function() {
console.log(1)
}
}
var vm = new Vue({
created: function() {
console.log(2)
},
mixins: [mixin]
})
// 1
// 2extends
类型 Object | Function
允许声明扩展另一个组件(可以是一个简单的选项对象或构造函数),而无需使用 Vue.extend。这主要是为了便于扩展单文件组件。
这和 mixins 类似,区别在于,组件自身的选项会比要扩展的源组件具有更高的优先级。
var CompA = {/**/}
// 在没有调用 Vue.extend 时继承 CompA
var CompB = {
extends: CompA,
// ...
}provide/inject
provide:Object | () => Object inject:Array<string> |
provide 和 inject 主要为高阶插件/组件库提供用例。并不推荐直接用于应用程序代码中。
这对选项需要一起使用,以允许一个祖先组件向其所有子孙后代注入一个依赖,不论组件层次有多深,并在起上下游关系成立的时间里始终生效。
provide选项应该是一个对象或返回一个对象的函数。该对象包含可注入其子孙的属性。在该对象中你可使用 Symbols 作为key,但是只在原生 Symbol 和 Reflect.ownKeys 的环境下可工作。
inject选项应该是一个字符串数组或一个对象,该对象的key代表了本地绑定的名称,value为其key(字符串或Symbol)以在可用的注入中搜索
提示:provide和inject绑定并不是可响应的。这是刻意为之的。然而,如果你传入一个可监听的对象,那么其对象的属性还是可响应的。
var Provider = {
provide: {
foo: 'bar'
}
}
var Child = {
inject: ['foo'],
created() {
console.log(this.foo) // 'bar'
}
}
// 利用 Symbols 函数provide 和对象inject
const s = Symbol()
const Provide = {
provide() {
return {
[s]: 'foo'
}
}
}
const Child = {
inject: {s}
}
// 使用一个注入的值作为一个属性的默认值:
const Child = {
inject: ['foo'],
props: {
bar: {
default() {
return this.foo
}
}
}
}
// 使用一个注入的值作为数据入口:
const Child = {
inject: ['foo'],
data() {
return {
bar: this.foo
}
}
}