24
How Do I

Render a form

Show a live form in Nuxt with the renderer component.

Use <FormForgeRenderer> when you want the fastest integration path.

app/pages/form/[slug].vue
<script setup lang="ts">
const route = useRoute()
</script>

<template>
  <FormForgeRenderer
    :form-key="String(route.params.slug)"
    show-progress
    show-submit
    @submitted="(response) => console.log(response)"
  />
</template>

When to use it

  • You want a full form UI without building one from scratch.
  • You want the renderer to manage navigation and validation.
  • You want the backend to remain the source of truth for the schema.
Use simulation or preview-oriented props when you want to keep the navigation visible during local review or playground usage.