Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Commit 93f6f89

Browse files
Merge pull request vuejs#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)

AltStyle によって変換されたページ (->オリジナル) /