本文共 2081 字，大约阅读时间需要 6 分钟。

40-41过滤器-42-43

  
     
       
     ​
   
  
    
    
     
            
               
                  
                  
出版名称
                  
出版日期
                  
价格
                  
购买数量
                  
操作
               
            
            
               
                  
{ {item.id}}
                  
{ {item.name}}
                  
{ {item.date}}
                                    
{ {item.price | showPrice}}
                  
 - { {item.count}} + 
                  
 移除 
               
            
         
    
     
总价格：{
  {totalPrice | showPrice}}
    
    
  
    
购物车为空
   
    

table{  border: 1px solid #e9e9e9;  border-collapse: collapse;  border-spacing: 0;}th, td{  padding: 8px 16px;  border: 1px solid #e9e9e9;  text-align: center;}th{  background-color: #f7f7f7;  color: #5c6b77;  font-weight: 600;}

const app = new Vue({  el: '#app',  data: {    books: [      {        id: 1,        name: '《算法导论1》',        data: '2006-9',        price: 85.00,        count: 1      },      {        id: 2,        name: '《算法导论2》',        data: '2006-9',        price: 85.00,        count: 1      },      {        id: 3,        name: '《算法导论3》',        data: '2006-9',        price: 85.00,        count: 1      },      {        id: 4,        name: '《算法导论4》',        data: '2006-9',        price: 85.00,        count: 1      },      {        id: 5,        name: '《算法导论5》',        data: '2006-9',        price: 85.00,        count: 1      },    ]  },  methods: {    // getFinalPrice(price){    //   return '￥' + price.toFixed(2);    // }    decrement(index){      this.books[index].count--;    },    increment(index){      this.books[index].count++;    },    removeHandle(index){      this.books.splice(index,1);    }  },  computed: {    totalPrice(){      let totalPrice = 0;      for(let i = 0; i < this.books.length; i++){        totalPrice += this.books[i].price * this.books[i].count;      }      return totalPrice;    }  },  filters: {     showPrice(price){      return '￥' + price.toFixed(2);     }  }})

知识点补充

    for(let i in arr)      i是数组的索引值；

    for(let i of arr)     i是数组的某一为的值；

转载地址：http://detzi.baihongyu.com/