namedTemplate 
Stability:
experimental ⚠️ Experimental feature, use at your riskWARNING
Not actively maintained now. Try createReusableTemplate instead.
With enabling namedTemplate, <template> can be referenced like a variable.
Sometimes we need to reverse the order of the very simple components, and don't want to give the features of Vue template up and use JSX/TSX. Then this feature is much helpful.
If you support this feature, you can go to the discussion and hit like 👍 or comment.
| Features | Supported |
|---|---|
| Vue 3 | ✅ |
| Vue 3.3 | ❌ |
| Nuxt 3 | ❌ |
| Vue 2 | ❌ |
| TypeScript / Volar | ❌ |
Basic Usage
vue
<script setup>
const pager = 'top'
</script>
<template name="pager">
<span>This is pager</span>
</template>
<template>
<template v-if="pager === 'top'">
<template is="pager" />
</template>
<span>Here is data table</span>
<template v-if="pager === 'bottom'">
<template is="pager" />
</template>
</template>Known Usage
- TypeScript / Volar support is not yet completed.
Kevin Deng