Skip to content

Commit 93f6f89

Browse files
authored
Merge pull request #144 from vuefe/2.0
获取官方英文文档更新
2 parents a4d9e9c + e98d4f0 commit 93f6f89

File tree

3 files changed

+40
-2
lines changed

3 files changed

+40
-2
lines changed

src/guide/class-and-style.md

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -109,6 +109,44 @@ data: {
109109
<div v-bind:class="[{ active: isActive }, errorClass]">
110110
```
111111

112+
### With Components
113+
114+
> This section assumes knowledge of [Vue Components](components.html). Feel free to skip it and come back later.
115+
116+
When you use the `class` attribute on a custom component, those classes will be added to the component's root element. Existing classes on this element will not be overwritten.
117+
118+
For example, if you declare this component:
119+
120+
``` js
121+
Vue.component('my-component', {
122+
template: '<p class="foo bar">Hi</p>'
123+
})
124+
```
125+
126+
Then add some classes when using it:
127+
128+
``` html
129+
<my-component class="baz boo"></my-component>
130+
```
131+
132+
The rendered HTML will be:
133+
134+
``` html
135+
<p class="foo bar baz boo">Hi</p>
136+
```
137+
138+
The same is true for class bindings:
139+
140+
``` html
141+
<my-component v-bind:class="{ active: isActive }"></my-component>
142+
```
143+
144+
When `isActive` is truthy, the rendered HTML will be:
145+
146+
``` html
147+
<div class="foo bar active"></div>
148+
```
149+
112150
## 绑定内联样式
113151

114152
### 对象语法

src/guide/components.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -286,7 +286,7 @@ Vue.component('child', {
286286

287287
### 动态 Props
288288

289-
类似于用 `v-bind` 绑定 HTML 特性到一个表达式,也可以用 `v-bind` 绑定动态 props 到父组件的数据。每当父组件的数据变化时,也会传导给子组件
289+
类似于用 `v-bind` 绑定 HTML 特性到一个表达式,也可以用 `v-bind` 动态绑定 props 的值到父组件的数据中。每当父组件的数据变化时,该变化也会传导给子组件
290290

291291
``` html
292292
<div>

themes/vue/layout/partials/community_dropdown.ejs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,6 @@
55
<li><a href="http://forum.vuejs.org" class="nav-link" target="_blank">论坛</a></li>
66
<li><a href="https://gitter.im/vuejs/vue" class="nav-link" target="_blank">聊天室</a></li>
77
<li><a href="https://twitter.com/vuejs" class="nav-link" target="_blank">Twitter</a></li>
8-
<li><a href="https://vuejobs.com/?ref_source=vue" class="nav-link" target="_blank">Jobs</a></li>
8+
<li><a href="https://vuejsjob.com/?ref=vuejs" class="nav-link" target="_blank">Jobs</a></li>
99
</ul>
1010
</li>

0 commit comments

Comments
 (0)