这里为什么要用三元表达式,直接this.activated="activated"?"" : "activated"不行吗

来源:3-6 Vue中的样式绑定

慕哥6752894

2018-04-20

写回答

3回答

于曼丽

2018-07-17

你这样写不可以的,this.activated = "activated" ? "" : "activated"

上面的代码将会把 this.activated 永远赋值为字符串 "activated" 

三元表达式的用法:this.activated = 条件 ? 结果1: 结果2 

三元表达式需要把条件转换为布尔值,然后来判断三元表达式的返回值是结果1还是结果2

如果条件为 true ,则 this.activated 的值为 结果1

如果条件为 false,则 this.activated 的值为 结果2

你的条件是字符串 "activated" ,该字符串转换为布尔值是 true,只有空字符串转换为布尔值才是 false

由于你的条件 "activated" 字符串转为布尔值是 true,所以你的 this.activated 的值永远是结果1

可以按照如下写:this.activated = this.activated ? "" : "activated"

上面的写法等号右边的三元表达式的条件为 this.activated ,当 this.activated 是空字符串时,转换为布尔值 false,三元表达式的结果为结果2,也就是字符串 "activated"。当 this.activated 是字符串 "activated" 时,转换为布尔值 true,三元表达式的结果为结果1,也就是空字符串

建议你重新学习一下 Javascript 语法基础,尤其是三元表达式以及 Javascript 数据类型和数据类型的转换

1
0

Zlear

2018-04-25

三元表达式得是条件 ?结果1 : 结果2 ,你上面缺少条件,前半句是个赋值语句,可写成:
this.actived === 'active' ? this.actived = '' : this.actived = 'active';
或者
this.actived = this.actived === 'active' ? '' : 'active';

1
0

Dell

2018-04-20

哪里,截图看下

0
0

Vue2.5-2.6-3.0开发去哪儿网App 零基础入门到实战

课程紧跟Vue3版本迭代,企业主流版本Vue2+Vue3全掌握

10675 学习 · 8191 问题

查看课程