疯狂的狮子Li
63 lines
1.5 KiB
Vue
63 lines
1.5 KiB
Vue
<!-- 动态表单渲染 -->
|
||
<script setup name="Render">
|
||
|
||
const props = defineProps({
|
||
formJson: {
|
||
type: [String, Object],
|
||
default: ""
|
||
},
|
||
formData: {
|
||
type: [String, Object],
|
||
default: ""
|
||
},
|
||
isView: {
|
||
type: Boolean,
|
||
default: false
|
||
}
|
||
})
|
||
|
||
const vFormRef = ref(null)
|
||
// 获取表单数据-异步
|
||
const getFormData = () => {
|
||
return vFormRef.value.getFormData()
|
||
}
|
||
|
||
/**
|
||
* 设置表单内容
|
||
* @param {表单配置} formConf
|
||
* formConfig：{ formTemplate：表单模板，formData：表单数据，hiddenField：需要隐藏的字段字符串集合，disabledField：需要禁用的自读字符串集合}
|
||
*/
|
||
const initForm = (formConf) => {
|
||
const { formTemplate, formData, hiddenField, disabledField } = toRaw(formConf)
|
||
if (formTemplate) {
|
||
vFormRef.value.setFormJson(formTemplate)
|
||
if (formData) {
|
||
vFormRef.value.setFormData(formData)
|
||
}
|
||
if (disabledField && disabledField.length > 0) {
|
||
setTimeout(() => {
|
||
vFormRef.value.disableWidgets(disabledField)
|
||
}, 200)
|
||
}
|
||
if (hiddenField && hiddenField.length > 0) {
|
||
setTimeout(() => {
|
||
vFormRef.value.hideWidgets(hiddenField)
|
||
}, 200)
|
||
}
|
||
if (props.isView) {
|
||
console.log(props.isView)
|
||
setTimeout(() => {
|
||
vFormRef.value.disableForm()
|
||
}, 100)
|
||
}
|
||
}
|
||
}
|
||
defineExpose({ getFormData, initForm })
|
||
</script>
|
||
|
||
<template>
|
||
<div class="">
|
||
<v-form-render ref="vFormRef" :form-json="formJson" :form-data="formData" />
|
||
</div>
|
||
</template>
|