Acho que um código assim deve funcionar para o seu problema (mesmo não tento muitos detalhes de como você tentou salvar no localStorage)
<template>
<div>
<form @submit.prevent="submit()">
<h3>Cadastro de usuários</h3>
<div id="app">
<input type="text" placeholder="Nome" v-model="name"/>
</div>
<div>
<input type="text" placeholder="Usuário" v-model="user"/>
</div>
<div>
<input type="password" placeholder="Senha" v-model="password"/>
</div>
<input type="password" placeholder="Confirmar Senha" v-model="confirmPassword" />
<div>
<input type="submit" id="salvar" value="Cadastrar" />
</div>
</form>
</div>
</template>
<script>
export default {
name: "App",
data() {
return {
name: "",
user: "",
password: "",
confirmPassword: ""
}
},
methods: {
submit() {
const userObject = {
name: this.name,
user: this.user,
password: this.password,
confirmPassword: this.confirmPassword
}
localStorage.setItem("userObject", JSON.stringify(userObject))
}
},
mounted() {
const savedUser = localStorage.getItem("userObject")
if(savedUser) {
console.log("usuario do localStorage")
console.log(JSON.parse(savedUser))
}
else {
console.log("usuario não existe no localStorage")
}
}
};
</script>
No método submit() eu só pego os dados do form e salvo no localStorage no formato JSON (acredito ser o melhor jeito para salvar essas informalções)
Além disso, implementei o método mounted() para mostrar no console quando tem o usuário salvo no localStorage (basta atualizar a página depois de salvar um usuário). Vale lembrar que como eu salvei em JSON eu preciso fazer o parse para poder usar o objeto no código