Transfer
Transfer
Markup Schema Example
<script lang="ts" setup>
import { createForm } from '@silver-formily/core'
import { FormItem, Submit, Transfer } from '@silver-formily/element-plus'
import { createSchemaField, FormProvider } from '@silver-formily/vue'
const form = createForm()
const { SchemaField, SchemaStringField } = createSchemaField({
components: {
FormItem,
Transfer,
},
})
function log(value: Record<string, any>) {
console.log(value)
}
</script>
<template>
<FormProvider :form="form">
<SchemaField>
<SchemaStringField
name="input"
title="Radio"
x-decorator="FormItem"
x-component="Transfer"
:enum="[
{
label: 'Option 1',
key: 1,
},
{
label: 'Option 2',
key: 2,
},
]"
/>
</SchemaField>
<Submit @submit="log">
Submit
</Submit>
</FormProvider>
</template>Radio:
No data
No data
查看源码
JSON Schema Example
<script lang="ts" setup>
import { createForm } from '@silver-formily/core'
import { Form, FormItem, Submit, Transfer } from '@silver-formily/element-plus'
import { createSchemaField } from '@silver-formily/vue'
const schema = {
type: 'object',
properties: {
transfer: {
'type': 'array',
'title': 'Transfer',
'enum': [
{ label: 'Option 1', key: 1 },
{ label: 'Option 2', key: 2 },
],
'x-decorator': 'FormItem',
'x-component': 'Transfer',
},
},
}
const form = createForm()
const { SchemaField } = createSchemaField({
components: {
FormItem,
Transfer,
},
})
async function onSubmit(value: Record<string, any>) {
console.log(value)
}
</script>
<template>
<Form :form="form" label-align="left" :label-width="160">
<SchemaField :schema="schema" />
<Submit @submit="onSubmit">
Submit
</Submit>
</Form>
</template>查看源码
Template Example
<script lang="ts" setup>
import { createForm } from '@silver-formily/core'
import { FormItem, Submit, Transfer } from '@silver-formily/element-plus'
import { Field, FormProvider } from '@silver-formily/vue'
const form = createForm()
function log(value: Record<string, any>) {
console.log(value)
}
</script>
<template>
<FormProvider :form="form">
<Field
name="input"
title="Radio"
:decorator="[FormItem]"
:component="[Transfer]"
:data-source="[
{
label: 'Option 1',
key: 1,
},
{
label: 'Option 2',
key: 2,
},
]"
/>
<Submit @submit="log">
Submit
</Submit>
</FormProvider>
</template>Radio:
No data
No data
查看源码