Modèle et valeurs Calculées

Bonjour,

Je vous explique mon problème.

J’ai visuellement un tableau qui est construit avec le modèle “AmountTable”.

“a11” et “a12” sont donc sur la ligne Col-1.
“a21” et “a22” sont donc sur la ligne Col-2.

Col-3 contient deux zone pointillées (a31 et a32) qui sont des “computed values”.
a31=(a11+a21) et a32=( a12+a22).

Le tout fonctionne bien.

Par contre si dans mon modèle par exemple j’échange les clés et valeurs de a11 et a12 la “computed value” de a31 ne s’exécutent plus.

S’il y a une personne qui peut me dire pourquoi cela ne marche plus.

Merci.

qu’est-ce que tu entends par “ne s’exécutent plus” ? comment est-ce que ça a été exécuté avant ?

ton AmountTable me paraît très très très bizarre

  • il mélange state (dépendant des input) et des computed properties apparemment
  • c’est un array d’array (matrice) mais tu as l’air d’utiliser des clés “aij” pour décrire les case de la matrice (et donc un seul object {} pourrait suffire, et décrire toute la matrice)

Est-ce que AmountTable est dans data ? dans computed ?

avec un peu plus de code pour nous montrer comment tu utilises ces différents éléments, on pourrait te répondre plus rapidement/efficacement

Salut le modèle est un peu bizarre, mais il y a une raison :slight_smile: En fait je travail sur un générateur de formulaire à la volée, et j’ai du adapter mon modèle de donnée pour que tout fonctionne de manière standard.

Mes “computed values” sont sur “a31” et “a32”. (Col 3 a31->201 et a32-> 441 )

“a31” fait la somme de “a11”(200) et “a21”(101)
“a32” de “a12”(220) et "a22’(221).

Pourquoi changer l’ordre des clefs de “a11” et “a12”. En fait dans mon système de génération de formulaire, j’ai un composant qui me permet de changer de place avec du drag and drop les éléments de même niveau. Dans mon ex ceux de ARRAY#1 (a11 et a12 )

Une fois que je change de place dans mon modèle les a11 et a12
au départ : { “a11” : “100” , “a12” : “220” }
une fois déplacé : { “a12” : “220” , “a11” : “100” }

Les “computed values” ne sont plus exécutées s’il y a un changement dans “a11” ou “a12”.

Si tu veux je peux te montrer cela en live sur Skype par ex.

Bien à toi
Shaan

Désolé si je suis direct : tu viens de répéter ton 1er message, mais tu n’as pas donné de nouvelles info qui pourraient aider à résoudre ton problème (des détails en plus pour le contexte mais pas sur le code).

Il y a 36 façons différentes de coder ce que tu viens d’énoncer. Du coup, si on ne voit pas comment tu l’as codé, on ne peut pas t’aider à chercher l’erreur.

  1. est-ce que AmountTable est dans data ? dans computed ? vuex ? (si oui, state ou getter)
  2. qu’est-ce que tu appelles des “computed values” ? (pour être sûr qu’on parle de la même chose)
  3. peux-tu montrer le code qui calcule a31 et a32 la 1ère fois et ne s’exécute plus après ?

“Amount” est dans mon modèle. ( dans la partie formatData )

“Computed value” => https://vuejs.org/v2/guide/computed.html

     computed:
    {
        "precalculated": function()
        {
            var resultExpression;
            var wFormulat = this.formula;

           resultExpression = this["" + wFormulat + ""]();

            this.$nextTick(
                function()
                {
                    this.setDataValue(resultExpression, true);

                    if (this.$el.querySelector("[v]") !== null)
                    {
                        this.eventTrigger(this.$el.querySelector("[v]"), 'validate');
                    }
                });

            return AutoNumeric.format("" + resultExpression + "", this.$root.config.autonumeric["" + this.config.autonumeric + ""]);
        }
    },

Un exemple de calcul : ( fonctions qui seront reprises dans un mixin )

    "Precalculated_C": function()
    {
        var a11 = this.findNestedNode((this.findNestedNode(this.$root.formData, "AmountTable")[0].AmountTable), "a11")[0].a11;
        var a21 = this.findNestedNode((this.findNestedNode(this.$root.formData, "AmountTable")[0].AmountTable), "a21")[0].a21;

        t = Number(a11) + Number(a21);

        return t;
    },

Le plus simple serait de voir le truc en live :wink:

Salut,

OK, on parle bien de la même chose, j’emploi plus le terme “computed properties” ou juste “computed”

Qu’est-ce que formatData ? (ce n’est pas qqch de l’API vue/vuex/nuxt)

Je vois plusieurs choses problématiques (les 2 1ers pouvant être source d’erreur)

  1. les computed ne doivent pas altérer le state (no side effect), ton $nextTick dans une computed c’est pas terrible (ça brise le “one way” data flow, est compliqué à debugger et peut faire des boucles infinies d’update). Il vaut mieux utiliser des watcher pour ça
  2. this.$root.config.autonumeric VS this.config.autonumeric : c’est normal les deux ?
  3. this.$el.querySelector : tu vas sélectionner un tag HTML géré par une autre librairie ? (si oui, me semble ok, si non il vaut mieux utiliser des ref

Quand est utilisé Precalculated_C ?