Skip to content

Commit 4089ecc

Browse files
committed
Footnotes for truthy.
1 parent a1bf084 commit 4089ecc

File tree

1 file changed

+5
-3
lines changed

1 file changed

+5
-3
lines changed

src/v2/guide/class-and-style.md

+5-3
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@ order: 6
1515
``` html
1616
<div v-bind:class="{ active: isActive }"></div>
1717
```
18-
上面的语法表示 `active` 这个 class 存在与否将取决于数据属性 `isActive` 是否为 [truthy](https://developer.mozilla.org/zh-CN/docs/Glossary/Truthy)
18+
上面的语法表示 `active` 这个 class 存在与否将取决于数据属性 `isActive` [truthiness](https://developer.mozilla.org/zh-CN/docs/Glossary/Truthy)
1919

2020
你可以在对象中传入更多属性来动态切换多个 class。此外,`v-bind:class` 指令也可以与普通的 class 属性共存。当有如下模板:
2121

@@ -105,7 +105,7 @@ data: {
105105
<div v-bind:class="[isActive ? activeClass : '', errorClass]"></div>
106106
```
107107

108-
这样写将始终添加 `errorClass`,但是只有在 `isActive``true` 时才添加 `activeClass`
108+
这样写将始终添加 `errorClass`,但是只有在 `isActive`truthy[^truthy] 时才添加 `activeClass`
109109

110110
不过,当有多个条件 class 时这样写有些繁琐。所以在数组语法中也可以使用对象语法:
111111

@@ -145,7 +145,7 @@ HTML 将被渲染为:
145145
<my-component v-bind:class="{ active: isActive }"></my-component>
146146
```
147147

148-
`isActive` 为真值 (译者注:truthy 不是 `true`[参考这里](https://developer.mozilla.org/zh-CN/docs/Glossary/Truthy)) 时,HTML 将被渲染成为:
148+
`isActive` truthy[^truthy] 时,HTML 将被渲染成为:
149149

150150
``` html
151151
<p class="foo bar active">Hi</p>
@@ -209,3 +209,5 @@ data: {
209209
```
210210

211211
这样写只会渲染数组中最后一个被浏览器支持的值。在本例中,如果浏览器支持不带浏览器前缀的 flexbox,那么就只会渲染 `display: flex`
212+
213+
[^truthy]: https://developer.mozilla.org/zh-CN/docs/Glossary/Truthy

0 commit comments

Comments
 (0)