feat: 移除 AllCustomPrimevue 组件,简化 App.vue 结构
This commit is contained in:
18
src/App.vue
18
src/App.vue
@ -1,20 +1,16 @@
|
||||
<script setup lang="ts">
|
||||
import TutorialForm from './tutorial-form/index.vue'
|
||||
import ZodForm from './zod-form/index.vue'
|
||||
import AllCustom from './all-custom/all-custom.vue'
|
||||
import AllCustomPrimevue from './all-custom-primevue/all-custom-primevue.vue'
|
||||
import AllCustom from './all-custom/all-custom.vue';
|
||||
import TutorialForm from './tutorial-form/index.vue';
|
||||
import ZodForm from './zod-form/index.vue';
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<ZodForm v-if="false" />
|
||||
<TutorialForm v-if="false" />
|
||||
|
||||
<div class="flex flex-col md:flex-row items-start p-4 gap-4">
|
||||
<div class="md:w-1/2 p-4 w-full bg-white rounded-lg shadow-md dark:bg-gray-800 dark:text-white">
|
||||
<AllCustom />
|
||||
</div>
|
||||
<div class="md:w-1/2 p-4 w-full bg-white rounded-lg shadow-md dark:bg-gray-800 dark:text-white">
|
||||
<AllCustomPrimevue />
|
||||
</div>
|
||||
<!-- <div class="flex flex-col md:flex-row items-start p-4 gap-4"> -->
|
||||
<div class="p-4 w-full bg-white rounded-lg shadow-md dark:bg-gray-800 dark:text-white">
|
||||
<AllCustom />
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</template>
|
||||
|
@ -1,83 +0,0 @@
|
||||
<template>
|
||||
<Fieldset
|
||||
legend="Form 1"
|
||||
pt:content:class="flex justify-center"
|
||||
>
|
||||
|
||||
<form
|
||||
class="flex flex-col gap-4 w-full"
|
||||
@submit.prevent="onFormSubmit"
|
||||
>
|
||||
|
||||
<div class="flex flex-col gap-2">
|
||||
<label for="username">Username</label>
|
||||
<InputText
|
||||
id="username"
|
||||
type="username"
|
||||
placeholder="Username"
|
||||
fluid
|
||||
:invalid="true"
|
||||
/>
|
||||
<Message
|
||||
icon="pi pi-key"
|
||||
severity="warn"
|
||||
size="small"
|
||||
variant="simple"
|
||||
>消息 warn</Message>
|
||||
</div>
|
||||
|
||||
<FormField
|
||||
name="FormField"
|
||||
initialValue="1"
|
||||
class="flex flex-col gap-2"
|
||||
>
|
||||
<label
|
||||
for="password"
|
||||
class="font-bold block mb-2"
|
||||
>Password</label>
|
||||
<Password
|
||||
name="password"
|
||||
placeholder="Password"
|
||||
toggleMask
|
||||
fluid
|
||||
promptLabel="输入密码"
|
||||
weakLabel="太简单"
|
||||
mediumLabel="复杂度一般"
|
||||
strongLabel="复杂密码"
|
||||
/>
|
||||
<Message
|
||||
severity="error"
|
||||
size="small"
|
||||
variant="simple"
|
||||
>
|
||||
<ul class="my-0 px-4 flex flex-col gap-1">
|
||||
<li
|
||||
v-for="(error, index) in [
|
||||
{ message: '错误1' },
|
||||
{ message: '错误2' }
|
||||
]"
|
||||
:key="index"
|
||||
>{{ error.message }}</li>
|
||||
</ul>
|
||||
</Message>
|
||||
|
||||
</FormField>
|
||||
|
||||
|
||||
<Button
|
||||
type="submit"
|
||||
severity="secondary"
|
||||
label="Submit"
|
||||
/>
|
||||
</form>
|
||||
</Fieldset>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Message from 'primevue/message';
|
||||
|
||||
function onFormSubmit(...args: any[]) {
|
||||
console.debug(`args :>> `, args);
|
||||
console.log('Form submitted');
|
||||
}
|
||||
</script>
|
Reference in New Issue
Block a user