diff --git a/src/guide/migration/transition-group.md b/src/guide/migration/transition-group.md new file mode 100644 index 00000000..f3379963 --- /dev/null +++ b/src/guide/migration/transition-group.md @@ -0,0 +1,40 @@ +--- +title: トランジショングループのルート要素 +badges: + - breaking +--- + +# {{ $frontmatter.title }} + +## 概要 + +`` は、デフォルトではルート要素をレンダリングしなくなりましたが、 `tag` プロパティでルート要素を作成することができます。 + +## 2.x での構文 + +Vue 2 では、 `` は他のカスタムコンポーネントと同様に、ルート要素を必要として、デフォルトでは `` となっており `tag` プロパティを通してカスタマイズできました。 + +```html + +
  • + {{ item }} +
  • +
    +``` + +## 3.x での構文 + +Vue 3 では [Fragments](/guide/migration/fragments.html) があるので、コンポーネントにはルート要素が _必要なくなりました_ 。そのため、 `` はデフォルトではルート要素をレンダリングしなくなりました。 + +- 上の例のように、 `tag` プロパティが Vue 2 のコードですでに定義されている場合、すべてが以前のように動作します +- もし定義されていなくて、スタイルやその他の動作が `` ルート要素の存在に依存していた場合は、 `` に `tag="span"` を追加するだけです + +```html + + + +``` + +## 参照 + +- [トランジションクラスの変更](/guide/migration/transition.html)