Skip to content
This repository was archived by the owner on Aug 8, 2022. It is now read-only.

docs: Update transition-group.md #724

Merged
merged 1 commit into from
Sep 16, 2021
Merged

docs: Update transition-group.md #724

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions src/guide/migration/transition-group.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,11 +8,11 @@ badges:

## 概览

`<transition-group>` 不再默认渲染根元素，但仍然可以用 `tag` prop 创建根元素。
`<transition-group>` 不再默认渲染根元素，但仍然可以用 `tag` attribute 创建根元素。

## 2.x 语法

在 Vue 2 中，`<transition-group>` 像其它自定义组件一样，需要一个根元素。默认的根元素是一个 `<span>`，但可以通过 `tag` prop 定制。
在 Vue 2 中，`<transition-group>` 像其它自定义组件一样，需要一个根元素。默认的根元素是一个 `<span>`，但可以通过 `tag` attribute 定制。

```html
<transition-group tag="ul">
Expand All @@ -26,8 +26,8 @@ badges:

在 Vue 3 中，我们有了[片段的支持](/guide/migration/fragments.html)，因此组件不再*需要*根节点。所以，`<transition-group>` 默认不再渲染根节点。

- 如果像上面的示例一样，已经在 Vue 2 代码中定义了 `tag` prop，那么一切都会和之前一样
- 如果没有定义 `tag` prop，*而且*样式或其它行为依赖于 `<span>` 根元素的存在才能正常工作，那么只需将 `tag="span"` 添加到 `<transition-group>`：
- 如果像上面的示例一样，已经在 Vue 2 代码中定义了 `tag` attribute，那么一切都会和之前一样
- 如果没有定义 `tag` attribute，*而且*样式或其它行为依赖于 `<span>` 根元素的存在才能正常工作，那么只需将 `tag="span"` 添加到 `<transition-group>`：

```html
<transition-group tag="span">
Expand Down