34 lines
768 B
Vue
34 lines
768 B
Vue
<script setup lang="ts">
|
|
import { useFormTest } from '~/composables/forms/test'
|
|
import { JsonForms } from '@jsonforms/vue'
|
|
import { vuetifyRenderers } from '@jsonforms/vue-vuetify'
|
|
|
|
definePageMeta({
|
|
title: 'Test Form',
|
|
icon: 'mdi-animation',
|
|
})
|
|
|
|
const { schema, uischema, data } = useFormTest()
|
|
|
|
const onChange = (event: JsonFormsChangeEvent) => {
|
|
data.value = event.data
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<img alt="Vue logo" src="./assets/logo.png" />
|
|
<h1>JSON Forms Vue 3</h1>
|
|
<div class="myform">
|
|
<json-forms
|
|
:data="data"
|
|
:renderers="vuetifyRenderers"
|
|
:schema="schema"
|
|
:uischema="uischema"
|
|
@change="onChange"
|
|
/>
|
|
</div>
|
|
<pre>{{ data }}</pre>
|
|
<!-- <pre>{{ typeof schema }}</pre>
|
|
<pre>{{ schema }}</pre> -->
|
|
</template>
|