vue计算属性getter错误=> [Vue警告]：渲染错误：“TypeError：无法读取未定义的属性'periodNum'”[重复]

Posted 2023-02-22

【中文标题】vue计算属性getter错误=> [Vue警告]：渲染错误：“TypeError：无法读取未定义的属性\'periodNum\'”[重复]

【英文标题】：vue computed property getter error => [Vue warn]: Error in render: "TypeError: Cannot read property 'periodNum' of undefined" [duplicate]vue计算属性getter错误=> [Vue警告]：渲染错误：“TypeError：无法读取未定义的属性'periodNum'”[重复]

【发布时间】：2019-04-29 21:30:51

【问题描述】：

    data() 
        return 
            unitPrice: 0.00,
            periodNum: 0,
             //totalPrice
        
    ,
    computed:
        totalPrice: ()=>
            return this.periodNum * this.unitPrice;
        
    ,
methods:... change periodNum and unitPrice functions here

我按照 vue doc 执行此操作：在 periodNum 和 unitPrice 更改时计算 totalPrice，但是在“return”行出现问题标题中的错误

【参考方案1】：

不要使用箭头函数。使用普通的function 或这样的简写：

computed: 
    totalPrice() 
        return this.periodNum * this.unitPrice;