Question

我有一些产品，我已经创建了一个数组，用VueJS＆amp;用户选择的每个产品都会进入列表，每次点击产品时，它都会增加＆＃34; Count＆＃34;值。每一个＆＃34; Count＆＃34;价值时间到＆＃34;价格＆＃34; ＆安培;写道＆＃34;总价格＆＃34;，但这＆＃34; TotalPrice＆＃34;只是一个产品。所以我的问题是我怎样才能加上所有＆＃34; TotalPrice＆＃34;从所有产品中显示用户总价？我应该用＆＃34; For Loop＆＃34; ？

Persons: [
    {Name: 'Ali', Family: 'Bahaari', Age: 20, Count: 0, Price: 200},
    {Name: 'Akbar', Family: 'Jahan', Age: 30, Count: 0, Price: 2500},
    {Name: 'Amir', Family: 'Pirozi', Age: 40, Count: 0, Price: 500},
    {Name: 'Reza', Family: 'Khosravi', Age: 50, Count: 0, Price: 100}
]

<tr v-for="Active in Activated">
    <td>{{ Active.Name }}</td>
    <td>{{ Active.Family }}</td>
    <td>{{ Active.Age }}</td>
    <td>{{ Active.Count }}</td>
    <td>{{ Active.Price }}</td>
    <td>{{ Active.Count * Active.Price }}</td>
</tr>

Answer 1

定义computed属性并计算总和：

computed : {
    totalPrice(){ return this.Activated.reduce((accumulator,currentValue) => accumulator + currentValue.Count * currentValue.Price)
}

然后在模板中使用它，就像任何其他变量一样：{{ totalPrice }}

Answer 2

以下是示例

http://jsbin.com/xumugemiza/edit?html,js,output

$(document).ready(
  function() {

    function download(button)
    {
      console.info(button);
      return true;
    }
  }
);

如何使用VueJs加上JS数组中相同索引的所有值

2 个答案: