我可以在 SFC <脚本设置>中定义 Vue JSX 组件并在 SFC 模板中使用它吗？

Question

我喜欢在React中，你可以在主组件文件中快速创建小组件。在Vue 3的合成API中，这样的事情可能发生吗?

像这样:

Component.vue

<script setup>
const SmallComponent = <div>Test</div>
</script>
<template>
<SmallComponent/>
</template>

Answer 1

这里的问题是SmallComponent不是组件，而是vnode对象。Vnodes可以直接在渲染函数中渲染，但不能在模板中渲染。

相反，它应该是功能组件:

const SmallComponent = props => <div>Test</div>

在script setup中，它是唯一可用的选项，因为语法提供了功能的子集，并且不支持呈现函数。