0👍
Better way to do that, install this
npm add vue-password
The VuePassword component adds support for a toggle to hide and show the
password as well as a meter to show the current strength of the password. And the strength ranges from 0 to 4.
<VuePassword
v-model="password1"
id="password1"
:strength="strength"
type="password"
/>
import VuePassword from 'vue-password';
export default {
components: {VuePassword,},
};
0👍
<div class="input-group auth-pass-inputgroup">
<input
v-model="password"
:type="passwordText"
class="form-control"
placeholder=""
aria-label="Password"
aria-describedby="password-addon"
/>
<a @click="passwordType(passwordText)"
type="button" class="mdi mdi-eye-outline"></a>
</div>
<script>
export default {
data() {
return {
passwordText: "password",
},
methods: {
passwordType(passwordText) {
this.passwordText = passwordText == "password" ? "text" : "password";
},
},
};
</script>
A solution I implemented for myself. you can apply this for yourself.
Source:stackexchange.com