<template>

    <form>

        <label>Name</label>

        <input name="firstname" v-model="profile.firstname">

        <input name="lastname" v-model="profile.lastname">

        <button v-on:click="save">submit</button>

     </form>

</template>

​

<script>

import {mapGetters } from 'vuex';

​

export default {

    data() {

        return {

            profile:{}

        }

    },

    watch: {

        getUserDetails (newData){

            this.profile = newData;

        }

    },

    created (){

        this.profile = this.$store.getters.getUserDetails;

    },

    computed: mapGetters([

        'getUserDetails'

    ]),

    methods:{

        save (){

            var _this = this;

            // ajax call to POST this.profile then

            _this.$store.commit('setData', {

                name: 'userDetails',

                data: this.profile

            });

        }

    }

}

</script>