Vue

A Vue 3 component around the Issued JavaScript SDK.

Install

bash

npm install @issued/vue

Minimal embed

vue

<template>
  <IssuedForm
    :project-id="projectId"
    :fields="fields"
    @success="onSuccess"
  />
</template>

<script setup lang="ts">
import { IssuedForm } from '@issued/vue';

const projectId = 'your-project-id';

const fields = {
  subject:     { visible: true, required: true },
  description: { visible: true, required: true },
  email:       { visible: true, required: false }
};

const onSuccess = (res: { ticketId: string }) => {
  console.log('Submitted:', res.ticketId);
};
</script>

Hidden metadata

vue

<script setup lang="ts">
import { IssuedForm } from '@issued/vue';
import { useAuth } from '@/composables/auth';

const { user } = useAuth();

const fields = {
  subject:     { visible: true, required: true },
  description: { visible: true, required: true },
  email:       { visible: false, value: user.value.email },
  userId:      { visible: false, value: user.value.id }
};
</script>

Styling & callbacks

Bind theme and callbacks props just like in React — see the styling guide and callbacks reference.

Gotchas

Works with Vue 3 (composition API). Nuxt users should wrap the component in <ClientOnly>.
The fields object should be stable — define it outside setup or wrap it in shallowRefso changes don't force a remount.

Next steps

Grab your embed code with the Vue tab pre-selected.

Your projects →