2019-03-13

5 计算属性

164940.png

样例代码

  
原始字符串: {{ message }}
  
计算后反转字符串: {{ reversedMessage }}

 

computed vs methods

3165133.png

实例1——购物车价格计算

    
        
        
        
        
        
        
    
    
        

            

                

                    

                        {{goods.id}}
                    
                    

                        {{goods.name}}
                    
                    

                        
                    
                    

                        {{goods.price}}
                    
                    

                        -
                        
                        +
                    
                
                

                

                    
总价：￥{{totalPrice}}
                    结算
                
                

                    你购买了{{settlement}}件商品，需要支付总价为：{{totalPrice}}元
                
            
        
        
    

image.png

image.png

实例2——搜索页面

    
        
        
        
        
        
    
    
        

            

                
                

                    
                        {{article.title}}
                    
                    

                        
                    
                
            
        
        
    

image.png