javascript - Pourriez-vous s'il vous plaît me dire comment utiliser correctement les types de données de référence dans Vuex?

Question

Lors de l'utilisation de vuex, logiquement, lorsque les données changent, vous devez utiliser l'appel action，再让action去触发mutation pour mettre à jour les données.

Mais comme dans l'exemple suivant, lorsque les données sont un type de données de référence, j'utilise les données directement v-model绑定数据，数据就可以直接更改了，不需要再调用action.

Si vous souhaitez appeler action，那么我只改对象中的其中一个key值，是要watchcet objet, puis lorsque l'objet change, passez directement le nouvel objet sous forme de paramètres, l'objet entier sera-t-il mis à jour ? Cela semble très gênant. Existe-t-il un autre moyen simple ?

Je voudrais donc demander, comment utiliser correctement un type de données de référence comme celui-ci dans vuex ?

Ci-joint le pseudo code :

état

state = {
 nestedObject: {
    sub: {
        key1: 'value',
        key2: 'value',
        key3: 'value',
        ...
    }
 }
}

fichier vue

<template>
    <input v-model="nestedObject.sub.key1" />
</template>
<script>
    computed: {
        ...mapGetters([
            'nestedObject'
        ])
    }
</script>

Answer 1

L'inconvénient de cet attribut d'objet d'état Vuex directement modifié est qu'il ne peut pas être suivi et débogué via les outils de développement Vue sans validation ou expédition

.

En plus d'utiliser watch, vous pouvez également envisager les méthodes suivantes :
https://jsfiddle.net/KingMari...
Dans vuex, il vous suffit de définir une mutation de updateKey1, ce qui est plus simple que de créer un deep watcher .