<div id="demo">
<anchored-heading level="1" text='hello world'></anchored-heading>
</div>
<script>
Xiao.component('anchored-heading', {
props:['level', 'text'],
render: function (createElement) {
console.log('createElement');
return createElement(
'h' + this.level,
this.text
)
}
})
var app = new Xiao({
el: '#demo',
})
</script>
其实很简单,创建的时候制定render函数,就不需要自己去解析模板生成render了。
然后调用render函数的时候,把渲染函数传入即可。
测试代码
createElement函数就是h函数