表单响应消费者,专门用于监听表单模型数据变化而实现各种 UI 响应的组件,使用方式为 scoped slot.
当回调函数内依赖的数据发生变化时就会重新渲染回调函数
Form 参考Form
<script setup>
import { createForm } from '@formily/core'
import { Field, FormConsumer, FormProvider } from '@silver-formily/vue'
import { ElInput } from 'element-plus'
const form = createForm()
</script>
<template>
<FormProvider :form="form">
<Field name="input" :component="[ElInput]" />
<FormConsumer>
<template #default="{ form: _form }">
{{ _form.values.input }}
</template>
</FormConsumer>
</FormProvider>
</template>