跳至主要内容

<svelte:element>

<svelte:element this={expression} />

<svelte:element> 元素允许您渲染在编写时未知的元素,例如来自 CMS 的元素。任何存在的属性和事件监听器都将应用于该元素。

唯一支持的绑定是 bind:this,因为 Svelte 的内置绑定不适用于通用元素。

如果 this 的值为 null 或 undefined,则不会渲染该元素及其子元素。

如果 this空元素(例如,br)的名称,并且 <svelte:element> 具有子元素,则在开发模式下会抛出运行时错误

<script>
	let tag = $state('hr');
</script>

<svelte:element this={tag}>
	This text cannot appear inside an hr element
</svelte:element>

Svelte 尽最大努力从元素周围环境推断正确的命名空间,但并非总是可行。您可以使用 xmlns 属性明确指定它

<svelte:element this={tag} xmlns="http://www.w3.org/2000/svg" />

this 必须是有效的 DOM 元素标签,例如 #textsvelte:head 将不起作用。

在 GitHub 上编辑此页面

上一页 下一页