Creating a Simple Random Password Generator Application using Vue.js and Tailwind CSS

Posted by

Simple Random Password Generator

Simple Random Password Generator

new Vue({
el: ‘#app’,
data: {
length: 8,
password: ”
},
methods: {
generate() {
const charset = ‘ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*()_+’;
let password = ”;
for (let i = 0; i < this.length; i++) {
password += charset.charAt(Math.floor(Math.random() * charset.length));
}
this.password = password;
},
copyToClipboard() {
const input = document.createElement('input');
input.style.position = 'fixed';
input.style.opacity = 0;
input.value = this.password;
document.body.appendChild(input);
input.select();
document.execCommand('copy');
document.body.removeChild(input);
alert('Password copied to clipboard');
}
}
});