老师解释一下

计算属性里的内容是什么意思呢

var当个程序猿 2020-03-08

源自：实战：Vue webAPP首页开发 1-2 Navbar 组件--基础组件开发

收起

3回答

好帮手慕慕子回答被采纳获得+3积分 2020-03-09 19:17:11

同学你好，type就是error下的一个属性，从同学截图的这段代码中理解，大致的意思就是：如果this.error有值，接着就会判断error上的这个属性type的值是否等于fatal，如果等于的话，classObject的值就是{'text-danger': true}, 那么，解析后的div标签为： <div class="text-danger"></div>。

同学可以试着理解下，祝学习愉快~

收起回答

好帮手慕慕子 2020-03-09 14:20:22

同学你好，因为text-danger中间有符号-，不符合对象语法中的属性名命名规则，所以添加单引号，把它作为整体，用来表示对象的一个属性名。

如果我的回答帮助到了你，欢迎采纳，祝学习愉快~

收起回答

提问者 var当个程序猿 #1

text-danger那一行老师可以解释下那个type吗

2020-03-09 16:37:40

好帮手慕慕子 2020-03-08 18:44:45

同学你好，首先，我们简单了解下计算属性，在Vue语法规定，每一个计算属性都对应的有一个方法，返回设置这个属性的值，当这个计算属性所依赖的数据发生改变时，会重新计算它的值。具体可以参考官网对计算属性的讲解与示例https://cn.vuejs.org/v2/guide/computed.html#%E8%AE%A1%E7%AE%97%E5%B1%9E%E6%80%A7

然后，我们再来看同学截图的示例，classObject是一个计算属性，当isActive或error发生改变时，就会重新计算classObject值。假如： isActive值true， error值为真，那么this.isActive&& !this.error 返回结果为true，那classObject的值就是active,也就是说标签在页面中渲染结果为 <div class="active"></div>

如果我的回答帮助到了你，欢迎采纳，祝学习愉快~

收起回答