Vuex - La propriété “name” a été attribué, mais il n'a pas de setter

J'ai un composant avec une certaine forme de validation. Il est un multi étape formulaire de commande. Le code ci-dessous est pour la première étape. J'aimerais vérifier que l'utilisateur a entré un peu de texte, stocker leur nom dans l'état global et ensuite l'envoyer ensuite à l'étape suivante. Je suis à l'aide de vee-valider et vuex

<template>
<div>
    <div class='field'>
        <label class='label' for='name'>Name</label>
        <div class="control has-icons-right">

            <input name="name" v-model="name" v-validate="'required|alpha'" :class="{'input': true, 'is-danger': errors.has('name') }" type="text" placeholder="First and Last">
            <span class="icon is-small is-right" v-if="errors.has('name')">
                <i class="fa fa-warning"></i>
            </span>
        </div>
        <p class="help is-danger" v-show="errors.has('name')">{{ errors.first('name') }}</p>

    </div>
    <div class="field pull-right">
        <button class="button is-medium is-primary" type="submit" @click.prevent="nextStep">Next Step</button>
    </div>
</div>
</template>

<script>
export default {
    methods: {
        nextStep(){
            var self = this;

            //from baianat/vee-validate
            this.$validator.validateAll().then((result) => {
                if (result) {
                    this.$store.dispatch('addContactInfoForOrder', self);
                    this.$store.dispatch('goToNextStep');
                    return;
                }
            });
        }
    },
    computed: {
        name: function(){
            return this.$store.state.name;
        }
    }
}
</script>

J'ai un magasin pour la manipulation de l'ordre de l'état et de l'enregistrement du nom. Finalement, je voudrais vous envoyer toutes les informations à partir de plusieurs étape du formulaire au serveur.

export default {
  state: {
    name: '',
  },

  mutations: {
    UPDATE_ORDER_CONTACT(state, payload){
      state.name = payload.name;

    }
  },

  actions: {
    addContactInfoForOrder({commit}, payload) {
      commit('UPDATE_ORDER_CONTACT', payload);
    }
  }
}

Lorsque j'exécute ce code, j'obtiens une erreur que Computed property "name" was assigned to but it has no setter.

Comment puis-je lier la valeur du champ nom de l'état global? Je voudrais être persistant, de sorte que même si un utilisateur va un pas en arrière (après avoir cliqué sur "Étape Suivante"), ils verront que le nom, ils sont entrés sur cette étape

En plus de Roy J, en réponse, il me semble que si l'aide v-for sur un calculées sans un setter lance cet avertissement.

OriginalL'auteur Connor Leech | 2017-09-07