Vue 中 Computed 踩坑记 — no setter

01

问 题

在Vue项目中出现如下错误提示： [Vue warn]: Computed property "totalPrice" was assigned to but it has no setter. (found in <Anonymous>) 代码：

<input v-model="totalPrice" />

02

原 因 v-model命令，因Vue 的双向数据绑定原理 ， 会自动操作 totalPrice， 对其进行set 操作 而 totalPrice 作为计算属性，默认情况下，只能获取值 ， 不能设置它的值

03

解决方案 解决方案： 1. 计算属性，最好不直接和命令使用，进行修改 2. 对 totalPrice 进行修改，让它支持 set 操作 代码如下：

computed: {
totalPrice : {
get: function () {
return this.money;
         },
set: function (newValue) {
this.money = newValue;
       }
    }
}