<template>
<input :type="passwordFieldType" v-model="password">
<button type="password" @click="switchVisibility">show / hide</button>
</template>
<script setup>
ref: password = "";
ref: passwordFieldType = "password";
const switchVisibility = () => passwordFieldType = passwordFieldType === "password" ? "text" : "password";
</script>
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.