From 7985ec1b44ba63e5c435a2598bc26ec6af609247 Mon Sep 17 00:00:00 2001 From: skirtle <65301168+skirtles-code@users.noreply.github.com> Date: Fri, 23 Jul 2021 17:20:41 +0100 Subject: [PATCH 1/7] docs: update the API entries for mixins and extends (#1146) * docs: update the API entries for mixins and extends * Update src/api/options-composition.md Co-authored-by: Ben Hong --- src/api/options-composition.md | 17 ++++++++++++----- 1 file changed, 12 insertions(+), 5 deletions(-) diff --git a/src/api/options-composition.md b/src/api/options-composition.md index 2817fa77..4d380de0 100644 --- a/src/api/options-composition.md +++ b/src/api/options-composition.md @@ -10,11 +10,15 @@ ミックスインフックは提供された順番に呼び出され、コンポーネント自身のフックよりも前に呼び出されます。 + :::info + In Vue 2, mixins were the primary mechanism for creating reusable chunks of component logic. While mixins continue to be supported in Vue 3, the [Composition API](/guide/composition-api-introduction.html) is now the preferred approach for code reuse between components. + ::: + - **例:** ```js const mixin = { - created: function() { + created() { console.log(1) } } @@ -34,20 +38,23 @@ ## extends -- **型:** `Object | Function` +- **型:** `Object` - **詳細:** - 別のコンポーネントを宣言的に拡張できます（純粋なオプションオブジェクトまたはコンストラクタのどちらでも）。これは主に単一ファイルコンポーネント間の拡張を簡単にすることを目的としています。 + Allows one component to extend another, inheriting its component options. + + From an implementation perspective, `extends` is almost identical to `mixins`. The component specified by `extends` will be treated as though it were the first mixin. + + However, `extends` and `mixins` express different intents. The `mixins` option is primarily used to compose chunks of functionality, whereas `extends` is primarily concerned with inheritance. - これは `mixins` に似ています。 + As with `mixins`, any options will be merged using the relevant merge strategy. - **例:** ```js const CompA = { ... } - // CompA を `Vue.extend` の呼び出しなしで拡張します const CompB = { extends: CompA, ... From 3c7cfe125e32bf2a7aaefe4ca0eea8ba5ec96a26 Mon Sep 17 00:00:00 2001 From: Naoki Endoh Date: Sun, 8 Aug 2021 12:56:57 +0900 Subject: [PATCH 2/7] docs: translate updates about options composition --- src/api/options-composition.md | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/api/options-composition.md b/src/api/options-composition.md index 4d380de0..05c30107 100644 --- a/src/api/options-composition.md +++ b/src/api/options-composition.md @@ -11,7 +11,7 @@ ミックスインフックは提供された順番に呼び出され、コンポーネント自身のフックよりも前に呼び出されます。 :::info - In Vue 2, mixins were the primary mechanism for creating reusable chunks of component logic. While mixins continue to be supported in Vue 3, the [Composition API](/guide/composition-api-introduction.html) is now the preferred approach for code reuse between components. + Vue 2 では、コンポーネントロジックの再利用可能なチャンクを作成するための主要なメカニズムがミックスインでした。Vue 3 では、引き続きミックスインがサポートされていますが、コンポーネント間でコードの再利用するには [Composition API](/guide/composition-api-introduction.html) が推奨されています。 ::: - **例:** @@ -42,13 +42,13 @@ - **詳細:** - Allows one component to extend another, inheriting its component options. + あるコンポーネントを別のコンポーネントに拡張して、そのコンポーネントオプションを継承することができます。 - From an implementation perspective, `extends` is almost identical to `mixins`. The component specified by `extends` will be treated as though it were the first mixin. + 実装の観点からは、`extends` は `mixins` とほとんど同じです。`extends` で指定されたコンポーネントは、最初のミックスインであるかのように扱われます。 - However, `extends` and `mixins` express different intents. The `mixins` option is primarily used to compose chunks of functionality, whereas `extends` is primarily concerned with inheritance. + しかし、`extends` と `mixins` は異なる意図を表現します。`mixins` オプションは主に機能のチャンクを構成するために使われ、`extends` は主に継承に関係しています。 - As with `mixins`, any options will be merged using the relevant merge strategy. + `mixins` と同様に、どのオプションも関連するマージ戦略を使ってマージされます。 - **例:** From c8f743a99116c94f82694cfd7ba0aed76e5cc801 Mon Sep 17 00:00:00 2001 From: skirtle <65301168+skirtles-code@users.noreply.github.com> Date: Fri, 23 Jul 2021 17:16:39 +0100 Subject: [PATCH 3/7] docs: document the removal of binding.expression (#1133) --- src/guide/migration/custom-directives.md | 2 ++ src/guide/migration/introduction.md | 2 +- 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/guide/migration/custom-directives.md b/src/guide/migration/custom-directives.md index 8ec9217c..1e087c11 100644 --- a/src/guide/migration/custom-directives.md +++ b/src/guide/migration/custom-directives.md @@ -9,6 +9,8 @@ badges: コンポーネントのライフサイクルに合わせて、ディレクティブのフック関数の名称が変更されました。 +加えて、`expression` 文字列は `binding` オブジェクトの一部として渡されなくなりました。 + ## 2.x での構文 Vue 2 では、以下のフックを使用して要素のライフサイクルをターゲットにしたカスタムディレクティブが作成していました。これらはすべてオプションです。 diff --git a/src/guide/migration/introduction.md b/src/guide/migration/introduction.md index 98c234be..a79637f8 100644 --- a/src/guide/migration/introduction.md +++ b/src/guide/migration/introduction.md @@ -100,7 +100,7 @@ Vue 3 で注目すべきいくつかの新機能の次のとおりです。 - `destroyed` ライフサイクルオプションの名前が `unmounted` に変更されました - `beforeDestroy` ライフサイクルオプションの名前が `beforeUnmount` に変更されました - [Props の `default` ファクトリ関数は `this` コンテキストにアクセスできなくなりました](/guide/migration/props-default-this.html) -- [コンポーネントライフサイクルに合わせてカスタムディレクティブ API が変更されました](/guide/migration/custom-directives.html) +- [コンポーネントライフサイクルに合わせてカスタムディレクティブ API が変更され、`binding.expression` が削除されました](/guide/migration/custom-directives.html) - [`data` オプションは常に関数として宣言されることが必要になりました](/guide/migration/data-option.html) - [ミックスインの `data` オプションは浅くマージされるようになりました](/guide/migration/data-option.html#mixin-merge-behavior-change) - [属性強制の戦略が変更されました](/guide/migration/attribute-coercion.html) From 25641382769aed8c3844bb25373a815256ca69be Mon Sep 17 00:00:00 2001 From: skirtle <65301168+skirtles-code@users.noreply.github.com> Date: Fri, 23 Jul 2021 17:16:25 +0100 Subject: [PATCH 4/7] fix: update link for 'SFC State-driven CSS Variables' RFC (#1145) --- src/guide/migration/introduction.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/guide/migration/introduction.md b/src/guide/migration/introduction.md index a79637f8..092719d8 100644 --- a/src/guide/migration/introduction.md +++ b/src/guide/migration/introduction.md @@ -54,7 +54,7 @@ Vue 3 で注目すべきいくつかの新機能の次のとおりです。 - [Emits Component Option](/guide/component-custom-events.html) - カスタムレンダラを作るための [`@vue/runtime-core` の `createRenderer` API](https://github.com/vuejs/vue-next/tree/master/packages/runtime-core) - [SFC での Composition API の Syntax Sugar (`