localStorage basic

<template>
    <div>
        <div :class="saved?'g':'r'">
            <input v-model="dobj.a"  @keyup="ment()"> -
            <select v-model="dobj.b" @change="ment()">
                <option v-for="elem in list" :key="elem">{{ elem }}</option>
            </select> -
            <button :disabled="saved" @click="ment()">Ment</button>
        </div>
        <hr>
        {{ dobj.a }} - {{ dobj.b }}
    </div>
</template>
<script>

export default {
    name: 'Cica',
    data() {
        return { dobj: {}, mentettobj: '', list: ['Cica','Majom','Kecske','Nyuszi'] }
    },
    methods: {
        ment() {
            this.mentettobj = JSON.stringify(this.dobj)
            localStorage.setItem('a',this.mentettobj)
        }
    },
    mounted(x) {
        this.mentettobj = localStorage.getItem( 'a' )
        this.dobj = JSON.parse( this.mentettobj )
    },
    computed: {
        saved() {
            return JSON.stringify(this.dobj) === this.mentettobj
        }
    }
}
</script>
<style>
div.g {
    background-color:rgb(138, 172, 151);
    box-shadow: 1px 1px 3px black;
}
div.r {
    background-color:rgb(174, 94, 106);
    box-shadow: 1px 1px 5px black;
}
div {
    border-radius:20px;
    padding: 20px;
    text-align: center;
}
</style>