选项 / 其它
name
类型:
string
限制:只有作为组件选项时起作用。
详细:
允许组件模板递归地调用自身。注意,组件在全局用 Vue.component()
注册时,全局 ID 自动作为组件的 name。
指定 name
选项的另一个好处是便于调试。有名字的组件有更友好的警告信息。另外,当在有 vue-devtools ,未命名组件将显示成 <AnonymousComponent>
,这很没有语义。通过提供 name
选项,可以获得更有语义信息的组件树。
delimiters
类型:
Array<string>
默认值:
["{ {", "} }"]
限制:这个选项只在完整构建版本中的浏览器内编译时可用。
详细:
改变纯文本插入分隔符。
- 示例:
new Vue({
delimiters: ['${', '}']
})
// 分隔符变成了 ES6 模板字符串的风格
functional
类型:
boolean
详细:
使组件无状态 (没有 data
) 和无实例 (没有 this
上下文)。他们用一个简单的 render
函数返回虚拟节点使他们更容易渲染。
model
2.2.0 新增
类型:
{ prop?: string, event?: string }
详细:
允许一个自定义组件在使用 v-model
时定制 prop 和 event。默认情况下,一个组件上的 v-model
会把 value
用作 prop 且把 input
用作 event,但是一些输入类型比如单选框和复选框按钮可能想使用 value
prop 来达到不同的目的。使用 model
选项可以回避这些情况产生的冲突。
- Example:
Vue.component('my-checkbox', {
model: {
prop: 'checked',
event: 'change'
},
props: {
// this allows using the `value` prop for a different purpose
value: String,
// use `checked` as the prop which take the place of `value`
checked: {
type: Number,
default: 0
}
},
// ...
})
<my-checkbox v-model="foo" value="some value"></my-checkbox>
上述代码相当于:
<my-checkbox
:checked="foo"
@change="val => { foo = val }"
value="some value">
</my-checkbox>
inheritAttrs
2.4.0 新增
类型:
boolean
默认值:
true
详细:
默认情况下父作用域的不被认作 props 的特性绑定 (attribute bindings) 将会“回退”且作为普通的 HTML 特性应用在子组件的根元素上。当撰写包裹一个目标元素或另一个组件的组件时,这可能不会总是符合预期行为。通过设置 inheritAttrs
到 false
,这些默认行为将会被去掉。而通过 (同样是 2.4 新增的) 实例属性 $attrs
可以让这些特性生效,且可以通过 v-bind
显性的绑定到非根元素上。
注意:这个选项不影响 class
和 style
绑定。
comments
2.4.0 新增
类型:
boolean
默认值:
false
限制:这个选项只在完整构建版本中的浏览器内编译时可用。
详细:
当设为 true
时,将会保留且渲染模板中的 HTML 注释。默认行为是舍弃它们。
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论