useCurd 新增和编辑

页面中的修改和编辑弹框一般功能及布局很相似，所以我们进行统一处理。

如何使用

vue

<template>
    <div>
        <DtCurdModal></DtCurdModal>
    </div>
</template>

<script lang="ts" setup>
    import { useCurd, useSource } from '@dt-frames/ui'

    const { curd } = useSource({
        ...
    })

    const { DtCurdModal } = useCurd({
        ...curd,        // 注意 这里是弹框与页面交互的枢纽
        title: '测试',
        width: '50%',
        schemas: [
            ...         // 表单相关配置
        ]
    })

</script>

useCurd API

属性	说明	类型	默认值
t	国际化备注	string
title	弹框标题	string \| ComputedRef \| () => string
width	弹框宽度	string \| number	'50%'
schemas	请参考表单配置	FormSchema[]
formProps	form表单的属性，请参考[表单配置](./form表单
footer	底部按钮控制	null \| ButtonProps[]
showFullscreen	是否显示全屏	boolean	`true`
showClosable	是否显示关闭按钮	boolean	`true`
primaryKey	物理主键	string \| number	'id'
onSave	点击保存按钮的回调	() => void
onQueryById	根据id查询数据	(id: Key) => Promise<any>
registerInstance	将useCurd组件内的数据传入到useSource，方便数据统一处理(注意：标准的增删改查必须有此属性)

useCurd 新增和编辑 ​

如何使用 ​

useCurd API ​

useCurd 新增和编辑

如何使用

useCurd API