前端遍历数组的方式很多,记录一下
<body> <div id="app"> <h2>{{TotalPrice}}</h2> </div> <script> const app = new Vue({ el: '#app', data: { books: [{ id: 110, name: 'a1', price: 119 }, { id: 111, name: 'a2', price: 120 }, { id: 112, name: 'a3', price: 121 }] }, //计算属性 computed: { fullname: function () { return this.firstName + " " + this.lastName; }, TotalPrice: function () { let result = 0; for (let i = 0; i < this.books.length; i++) { result += this.books[i].price; } for (let i in this.books) { result += this.books[i].price; } for (let i of this.books) { result += i.price; }//注意of是类似于foreach的 直接取的对象 result =this.books.map(n => n.price).reduce((pre,n) => pre + n); return result; } } }) </script> </body>