Computed property was assigned to but it has no setter

news/2024/7/10 2:12:52 标签: vue

Vue中,计算属性默认只有getter,如果你在代码中尝试给你计算属性赋值(需要setter),那么就会有如上的错误,即计算属性相当于是只读的。

// 以下计算属性只用getter。即只能读取foo
computed: {
	foo() {
		return 'hello' + this.bar;
	}
}

// 尝试给foo赋值,会给出Computed property "foo" was assigned to but it has no setter
this.foo = 'hello baz';

可以思考一下,计算属性设计的目的是为了减少模板(template)中的逻辑判断。而模板中的逻辑绝大部分都是只读的。我们很少在模板去赋值。固计算属性并没有提供setter

简单的解决这个问题,就是看一下代码中是否给计算属性赋值了。如果赋值了,就去掉。你可能会问,如果我就是想赋值呢?那么你需要知道计算属性应该通过修改其依赖的值从而间接的修改自己

computed: {
  fullName: {
    // getter
    get: function () {
      return this.firstName + ' ' + this.lastName
    },
    // setter
    set: function (newValue) {
      var names = newValue.split(' ')
      this.firstName = names[0]
      this.lastName = names[names.length - 1]
    }
  }
}

如上,fullName是计算属性,这里显式的定义计算属性的getter和setter。

当给fullName赋值的时候,其实是通过给firstNamelastName分别赋值,进而实现修改fullName的目的。

这一点恐怕还要思考一下才能转过弯来。我举一个列子:公鸡和母鸡一起生了一个鸡蛋,但你觉得鸡蛋太小,想吃个鸭蛋。那么你是不能直接把鸡蛋换成鸭蛋的,你有想过公鸡和母鸡的感受么…事实上你应该养一对公鸭和母鸭去实现你的想法,即通过把鸡改成鸭子的方式,间接的把鸡蛋改成了鸭蛋…


http://www.niftyadmin.cn/n/1382648.html

相关文章

STM32固件库

一、STM32固件库开发和传统寄存器开发方式的区别 二、CMSIS标准 CMSIS标准--Cortex Microcontroller Software Interface Standard,是ARM公司为了解决不同SOC厂商生产不同的Cortex某系类芯片的软件兼容性问题,与芯片厂商建立的软件内核标准。 1、Cortex-…

【C#】给无窗口的进程发送消息

【C#】给无窗口的进程发送消息 注:本文适用.net2.0的winform程序 一个winform程序,我希望它不能多开(但是如何防多开不是本文要讲的),那么在用户启动第二个实例的时候,作为第二个实例来说,大概可…

爱加密与安百科技深度“联姻” 共同消弭企业“安全孤岛”

【51CTO.com原创稿件】日前,爱加密携手安百科技举行了一场“洞悉未知风险,共建生态安全”的战略合作发布会。爱加密CEO郭训平和安百科技CEO康伟在现场签署了战略合作协议,共同宣布双方将实现共享数据/互通技术,全力打造网络信息安…

12,Jenkins实战应用--Jenkins复杂邮件推送配置详解

版权声明:版权归属于eryajf.net,如欲有更多交流,可以访问个站:http://eryajf.net。未经授权,禁止转载。 https://blog.csdn.net/eryajf/article/details/82904485 *系列汇总* 这是一个系列文章,大大小小到今…

查看mysql数据库的大小

2019独角兽企业重金招聘Python工程师标准>>> select * from information_schema.TABLES where information_schema.TABLES.TABLE_SCHEMAweixin_house_green and information_schema.TABLES.TABLE_NAMEuser\G; 转载于:https://my.oschina.net/eonezhang/blog/262926…

更改已有docker容器的映射端口号port mapping

这个其实是很不好改的。因为docker start命令不支持绑定端口。 # run 支持-p , 以下命令ok $ docker run -p 80:80 image# docker start 不支持-p命令,固以下命令 not ok... $ docker start -p 80:80 image所以如果想改端口,比较优雅的做法是&#xff0…

上网体验今非昔比 北京五环内95%公交车开通免费16WiFi

记者日前获悉,北京五环内95%公交车已经正式开通免费16WiFi。从11月25日起一个月内,16WiFi在全城开展有奖报修活动,“蹭不了网,就奖流量”。 据介绍,自7月11日300路率先完成升级改造,经过3个月的设备拆旧换新…

【转】vue父子组件之间的通信

vue父子组件之间的通信 在vue组件通信中其中最常见通信方式就是父子组件之中的通性,而父子组件的设定方式在不同情况下又各有不同。最常见的就是父组件为控制组件子组件为视图组件。父组件传递数据给子组件使用,遇到业务逻辑操作时子组件触发父组件的自定…