Skip to content

Commit 23e5b37

Browse files
committed
docs: Add example with custom input
1 parent b2201bc commit 23e5b37

File tree

1 file changed

+22
-0
lines changed

1 file changed

+22
-0
lines changed

README.md

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -71,6 +71,27 @@ Interactive password strength meter based on [zxcvbn](https://github.com/dropbox
7171
</script>
7272
```
7373

74+
### With custom input
75+
76+
```html
77+
78+
<template>
79+
<div>
80+
<input type="password" v-model="password">
81+
<password v-model="password" :strength-meter-only="true"/>
82+
</div>
83+
</template>
84+
85+
<script>
86+
import Password from 'vue-password-strength-meter'
87+
export default {
88+
components: { Password },
89+
data: () => ({
90+
password: null
91+
})
92+
}
93+
</script>
94+
```
7495
## Props
7596

7697
| Prop | Type | Default Value | Description
@@ -102,6 +123,7 @@ Interactive password strength meter based on [zxcvbn](https://github.com/dropbox
102123
- `@score` will return the zxcvbn score (Integer from 0-4) [] (https://github.com/dropbox/zxcvbn#usage)
103124
- `@feedback` will return an zxcvbn feedback object with `suggestion` and `warning`
104125

126+
105127
## 💅 Customizing
106128

107129
You can customize the styling of the input field, badge and strength-meter by passing your own css classes

0 commit comments

Comments
 (0)