Question

我的vue组件，您可以在下面看到：

private void SearchBox_TextChanged(object sender, TextChangedEventArgs e)
{
   TicketViewModel vm = this.DataContext as TicketViewModel;
   vm.TicketFilter();
}

我尝试上面的代码

但是，似乎还是错的

我该如何正确解决？

我还是vue.js 2中的新手

Answer 1

由于TypeError: this.$store.state.transaction.list.reduce is not a function是Frank的回答中标记的错误，我认为this.$store.state.transaction.list不是Array而是object为v-for次迭代通过两者。

total: function() { 
  var list = this.$store.state.transaction.list 
  var sum = 0 
  for(var listProps in list) { 
    list[listProps].products.forEach(function (product) { 
    sum += product.pivot.quantity * product.pivot.price 
    }) 
  } 
  return sum; 
}

Answer 2

使用其他计算属性

<script>
    export default {
        ...
        computed: {
            list: function() {
                return this.$store.state.transaction.list
            },
            total: function() {
                return this.$store.state.transaction.list.reduce(function(sum, item) {
                    sum += item.products.reduce(function(tmp, product) { tmp += product.quantity * product.price; return tmp; }, 0);
                    return sum;
                }, 0);
            }
            ...
        }
    }
</script>

使用嵌套的Array.reduce来获取列表中包含许多项目且项目包含许多产品的结构总数

如何计算vue组件中的总数？ Vue.JS 2

2 个答案: