<! DOCTYPEhtml>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <div id="app">
        <h2>{{totalPrice}}</h2>
    </div>

    <script src=".. /js/vue.js"></script>
    <script>
        const app = new Vue({
        el: '#app'.data: {
            books: [{id: 110.name: 'Unix programming'.price: 119},
                {id: 111.name: 'Complete Code'.price: 120},
                {id: 112.name: 'Deep understanding of computer principles'.price: 88},
                {id: 113.name: 'Modern Operating Systems'.price: 99}},],computed: {
                totalPrice: function () {
                     let result = 0;
                     for (let i=0; i<this.books.length; i++){ result +=this.books[i].price
                   }
                   return result

                    // for (let i in this.books) {
                    // this.books[i]
                    // }
                    //
                    // for (let book of this.books) {
                    //
                    // }}}})</script>
</body>
</html>
Copy the code