feat: 为 PInputText 组件添加帮助信息支持
This commit is contained in:
@ -5,6 +5,7 @@ import SchemaComponent from 'primevue/inputtext';
|
|||||||
import { markRaw } from 'vue';
|
import { markRaw } from 'vue';
|
||||||
import { floatLabel } from '../sections/floatLabel';
|
import { floatLabel } from '../sections/floatLabel';
|
||||||
import { messages } from '../sections/messages';
|
import { messages } from '../sections/messages';
|
||||||
|
import { help } from '../sections/help';
|
||||||
|
|
||||||
const input = createSection('input', () => ({
|
const input = createSection('input', () => ({
|
||||||
$cmp: markRaw(SchemaComponent) as never,
|
$cmp: markRaw(SchemaComponent) as never,
|
||||||
@ -29,6 +30,7 @@ export const PInputText: FormKitTypeDefinition = {
|
|||||||
input(), //
|
input(), //
|
||||||
label('$label'),
|
label('$label'),
|
||||||
),
|
),
|
||||||
|
help('$help'),
|
||||||
messages(),
|
messages(),
|
||||||
),
|
),
|
||||||
features: [casts],
|
features: [casts],
|
||||||
|
14
src/__fk-inputs__/sections/help.ts
Normal file
14
src/__fk-inputs__/sections/help.ts
Normal file
@ -0,0 +1,14 @@
|
|||||||
|
import { createSection } from '@formkit/inputs';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Help section that shows help text
|
||||||
|
*
|
||||||
|
* @public
|
||||||
|
*/
|
||||||
|
export const help = createSection('help', () => ({
|
||||||
|
$el: 'div',
|
||||||
|
if: '$help',
|
||||||
|
attrs: {
|
||||||
|
id: '$: "help-" + $id',
|
||||||
|
},
|
||||||
|
}));
|
@ -1,4 +1,4 @@
|
|||||||
import MessagesCmp from '@/__fk-inputs__/components/messages.vue';
|
import MessagesCmp from '../components/messages.vue';
|
||||||
import { createSection } from '@formkit/inputs';
|
import { createSection } from '@formkit/inputs';
|
||||||
import { markRaw } from 'vue';
|
import { markRaw } from 'vue';
|
||||||
|
|
||||||
|
@ -106,6 +106,7 @@ const promiseCascadeOptions = new Promise<typeof K_FLAT_TREE>((resolve) => {
|
|||||||
name="PInputText"
|
name="PInputText"
|
||||||
label="输入框"
|
label="输入框"
|
||||||
value="`default value from field`"
|
value="`default value from field`"
|
||||||
|
help="帮助信息帮助信息帮助信息帮助信息"
|
||||||
some="prop"
|
some="prop"
|
||||||
some-boolean-prop
|
some-boolean-prop
|
||||||
validation="required"
|
validation="required"
|
||||||
@ -167,6 +168,7 @@ const promiseCascadeOptions = new Promise<typeof K_FLAT_TREE>((resolve) => {
|
|||||||
:preserve="false"
|
:preserve="false"
|
||||||
name="customType"
|
name="customType"
|
||||||
value="this input will display if the password is empty"
|
value="this input will display if the password is empty"
|
||||||
|
help="helppppppppppp"
|
||||||
>
|
>
|
||||||
<!-- <template #label>
|
<!-- <template #label>
|
||||||
<div>labelll</div>
|
<div>labelll</div>
|
||||||
|
Reference in New Issue
Block a user