Суммарный расчет вычисляемых свойств в vue

1. Основное использование

Определите функцию в вычислении (она выглядит как функция, но на самом деле является атрибутом) и назовите ее в соответствии со спецификацией атрибута.

2. Сценарии применения

Если логика данных A очень сложна, запишите данные A в вычисляемый атрибут. Например, оформление корзины покупок.

3. Ценность

Для функций с возвращаемым значением вычисляемый атрибут a используется так же, как данные в data. Вычисляемые атрибуты определяются в вычисляемых значениях и не требуют определения в данных. Их можно использовать непосредственно в шаблоне так же, как данные, определенные в данных.

Просто вызовите this.totalPrice непосредственно в методах.

<template>
  <div>
    <div>{
   
   { totalPrice }}</div>
  </div>
</template>

<script>

export default {
  data() {
    return {
      list: [
        { id: 1, price: 10 },
        { id: 2, price: 20 },
        { id: 3, price: 40 },
      ],
    };
  },
// 计算属性
  computed: {
    totalPrice() {
      var sum = 0;
      for (let i = 0; i < this.list.length; i++) {
        sum += this.list[i].price;
      }
      return sum;
    },
  },

};
</script>

Guess you like

Origin blog.csdn.net/m0_61672533/article/details/130378824