阅读时间:1 分钟
0 字
表单设计
推荐使用 DuxPageForm / DuxModalForm,自动处理 create/edit、提交与错误提示。
vue
<script setup lang="ts">
import { DuxFormItem, DuxPageForm } from '@duxweb/dvha-pro'
import { NInput } from 'naive-ui'
import { computed, ref } from 'vue'
import { useRoute } from 'vue-router'
const route = useRoute()
const id = computed(() => route.params.id as string)
const model = ref({ name: '' })
</script>
<template>
<DuxPageForm :id="id" :data="model" path="system/role">
<DuxFormItem label="角色名称">
<NInput v-model:value="model.name" />
</DuxFormItem>
</DuxPageForm>
</template>path对应资源路径(不含/admin前缀)。id有值时进入编辑模式。