jsxDirective
Stability:
experimental
⚠️ Experimental feature, use at your riskv-if
and v-for
directive for jsx.
Features | Supported |
---|---|
Vue 3 | ✅ |
Nuxt 3 | ✅ |
Vue 2 | ✅ |
Volar | ✅ |
Usage
vue
<script setup lang="tsx">
const { foo, list } = defineProps<{
foo: number
list: number[]
}>()
defineRender(() => (
<>
<div v-if={foo === 0}>
<div v-if={foo === 0}>0-0</div>
<div v-else-if={foo === 1}>0-1</div>
<div v-else>0-2</div>
</div>
<div v-for={(i, index) in list} key={index}>
{i}
</div>
</>
))
</script>