規(guī)則
render: function (h) {
return h('div', //dom節(jié)點(diǎn)名 或者渲染函數(shù)
{
// 和`v-bind:class`一樣的 API
'class': {
foo: true,
bar: false
},
// 和`v-bind:style`一樣的 API
style: {
color: 'red',
fontSize: '14px'
},
// 正常的 HTML 特性 也可以向子節(jié)點(diǎn)傳遞props
// id:'foo'
attrs: {
id: 'foo'
},
// 組件 props
props: {
myProp: 'bar'
},
// DOM 屬性
domProps: {
innerHTML: 'baz'
},
// 事件監(jiān)聽器基于 `on`
// 所以不再支持如 `v-on:keyup.enter` 修飾器
// 需要手動匹配 keyCode。
on: {
click: this.clickHandler
},
// 僅對于組件适掰，用于監(jiān)聽原生事件曹洽，而不是組件內(nèi)部使用 `vm.$emit` 觸發(fā)的事件各吨。
nativeOn: {
click: this.nativeClickHandler
},
// 自定義指令。注意凛捏，您無法對綁定中的 `oldValue` 賦值
// Vue 會為您持續(xù)追蹤
directives: [{
name: 'my-custom-directive',
value: '2',
expression: '1 + 1',
arg: 'foo',
modifiers: {
bar: true
}
}],
// Scoped slots in the form of
// { name: props => VNode | Array<VNode> }
scopedSlots: {
default: props => createElement('span', props.text)
},
// 如果組件是其他組件的子組件，需為插槽指定名稱
slot: 'name-of-slot',
// 其他特殊頂層屬性
key: 'myKey',
ref: 'myRef'
}, [] //放子節(jié)點(diǎn)的
)
}
