Skip to content

Commit

Permalink
docs: translate step 14of tutorial
Browse files Browse the repository at this point in the history
  • Loading branch information
xiaodong2008 committed Apr 27, 2024
1 parent 3744be8 commit 3f857b7
Showing 1 changed file with 6 additions and 6 deletions.
12 changes: 6 additions & 6 deletions src/tutorial/src/step-14/description.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# 插槽 {#slots}

除了通过 props 传递数据外,父组件还可以通过**插槽** (slots) 将模板片段传递给子组件
除了通過 props 傳遞數據外,父組件還可以通過**插槽** (slots) 將模板片段傳遞給子組件

<div class="sfc">

Expand All @@ -21,29 +21,29 @@

</div>

在子组件中,可以使用 `<slot>` 元素作为插槽出口 (slot outlet) 渲染父组件中的插槽内容 (slot content):
在子組件中,可以使用 `<slot>` 元素作為插槽出口 (slot outlet) 渲染父組件中的插槽內容 (slot content):

<div class="sfc">

```vue-html
<!-- 在子组件的模板中 -->
<!-- 在子組件的模板中 -->
<slot/>
```

</div>
<div class="html">

```vue-html
<!-- 在子组件的模板中 -->
<!-- 在子組件的模板中 -->
<slot></slot>
```

</div>

`<slot>` 插口中的内容将被当作“默认”内容:它会在父组件没有传递任何插槽内容时显示
`<slot>` 插口中的內容將被當作“默認”內容:它會在父組件沒有傳遞任何插槽內容時顯示

```vue-html
<slot>Fallback content</slot>
```

现在我们没有给 `<ChildComp>` 传递任何插槽内容,所以你将看到默认内容。让我们利用父组件的 `msg` 状态为子组件提供一些插槽内容吧
現在我們沒有給 `<ChildComp>` 傳遞任何插槽內容,所以你將看到默認內容。讓我們利用父組件的 `msg` 狀態為子組件提供一些插槽內容吧

0 comments on commit 3f857b7

Please sign in to comment.