使用带有渲染功能的 Vue.js 3 片段
Posted
技术标签:
【中文标题】使用带有渲染功能的 Vue.js 3 片段【英文标题】:Use Vue.js 3 fragments with render function 【发布时间】:2021-02-07 03:59:10 【问题描述】:我应该如何使用带有渲染功能的 Vue 3 片段?下面的代码不应该工作吗?
import h from 'vue'
render ()
return [
h('label', htmlFor: 'username' , this.label),
h('input', id: 'username' ),
]
,
【问题讨论】:
【参考方案1】:是的,在渲染函数中定义片段的语法是正确的:
import h from "vue";
export default
props: ["label", "errors"],
render()
return [
h("label", htmlFor: "username" , this.label),
h("input", id: "username" ),
this.errors && h("span", class: "red" , this.errors)
];
;
这相当于:
<template>
<label for="username"> this.label</label>
<input id="username" />
<span class="red" v-if="errors">errors</span>
</template>
LIVE DEMO
【讨论】:
以上是关于使用带有渲染功能的 Vue.js 3 片段的主要内容,如果未能解决你的问题,请参考以下文章