PersonaInput Password
Base password-input form.
Usage
Simple Usage
preview
vue
<template>
<p-input-password />
</template>Sizing
preview
vue
<template>
<p-input-password size="xs" />
<p-input-password size="sm" />
<p-input-password size="md" />
<p-input-password size="lg" />
</template>Disabled State
preview
vue
<template>
<p-input-password disabled />
</template>Readonly State
preview
vue
<template>
<p-input-password readonly />
</template>Error State
preview
vue
<template>
<p-input-password error />
</template>Clearable
preview
vue
<template>
<p-input-password clearable />
</template>Binding v-model
Like other input, input value can be binding with v-model.
preview
result:
-vue
<template>
<p-input-password v-model="result" />
</template>API
Props
| Props | Type | Default | Description |
|---|---|---|---|
size | String | md | Input size variant, valid value: xs, sm, md, lg |
placeholder | String | - | Input placeholder |
disabled | Boolean | false | Disabled state |
readonly | Boolean | false | Readonly state |
error | Boolean | false | Error state |
clearable | Boolean | false | Enable clear button |
modelValue | String | - | v-model value |
Slots
| Name | Description |
|---|---|
| There no slots here | |
Events
| Name | Arguments | Description |
|---|---|---|
change | String | Event when value changed |
clear | - | Event when clear button clicked |