Vueform | Open-Source Form Framework for Vue

1 min read Original article ↗

vue

<template>
  <Vueform v-bind="$data" />
</template>
<script>
export default {
  data: () => ({
    endpoint: '/submit/survey/489432',
    schema: {
      title: { type: 'static', content: `<div class='font-semibold text-2xl'>Survey</div><p class='text-gray-500 m-0'>Please fill in this survey</p>` },
      question1: { type: 'text', label: 'Your name' },
      question2: { type: 'text', label: 'Your age', columns: 6 },
      question3: { type: 'select', label: 'Your gender', items: ['Male', 'Female', 'X'], columns: 6 },
      question4: { type: 'select', label: 'How likely are you to recommend our services?', default: 10, items: [1,2,3,4,5,6,7,8,9,10], description: '1 means very unlikely, 10 means very likely' },
      button: { type: 'button', buttonLabel: 'Submit', submits: true, },
    }
  })
}
</script>