VueJS: Sum up computed values to one computed value

Question

I have a html form and based on the user input I want to give a total score of completion (e.g 80%). My plan is to do that with computed values that are watching seperate parts of the form and for the total score I want to sum them up like so:

simplified version of the vue file:

[..]
computed: {

      Chk_input1: function(){
          // Here will be a check if at least 4 characters in input field, if yes
          return 30
      },

      Chk_input2: function(){
        // Here will be a check if multiple conditions are met, if yes
          return 30
      },

      Chk_input3: function(){
        // Here will be a check if at least 4 characters in input field, if yes
          return 26
      },

      total_score: function(Chk_input1, Chk_input2, Chk_input3){
          // finally sum up the computed values input1 - input3
          return Chk_input1 + Chk_input2 + Chk_input3
      }
  },

But the result is:

total_score =  [object Object]undefinedundefined%

How do I sum up these values properly?

Tanner · Accepted Answer · 2020-03-16 14:09:13Z

1

Wherever you're calling total_score, you're passing an object for the first argument, and undefined to the second two.

total_score should be written like this:

total_score: function() {
  return this.Chk_input1 + this.Chk_input2 + this.Chk_input3
}

The difference between my code and yours is that my code is accessing the other computed properties to return a sum, and yours is accepting arguments, which it accesses to calculate the sum.

answered Mar 16, 2020 at 14:09

Tanner

2,4411 gold badge15 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

VueJS: Sum up computed values to one computed value

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related