From 7c1c5a6eef43260b97d7bdf9cdf5ac9036b33b2f Mon Sep 17 00:00:00 2001 From: daisuke Date: Sun, 8 Nov 2020 17:20:13 +0900 Subject: [PATCH 1/2] =?UTF-8?q?Migration=20Guide=20>=20Props=20Default=20F?= =?UTF-8?q?unction=20`this`=20Access=20=E3=81=AE=E7=BF=BB=E8=A8=B3?= =?UTF-8?q?=E5=85=83=E3=83=95=E3=82=A1=E3=82=A4=E3=83=AB=E8=BF=BD=E5=8A=A0?= =?UTF-8?q?=20(=20#122=20)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/.vuepress/config.js | 1 + src/guide/migration/props-default-this.md | 32 +++++++++++++++++++++++ 2 files changed, 33 insertions(+) create mode 100644 src/guide/migration/props-default-this.md diff --git a/src/.vuepress/config.js b/src/.vuepress/config.js index 8b58501b..fb7aa795 100644 --- a/src/.vuepress/config.js +++ b/src/.vuepress/config.js @@ -125,6 +125,7 @@ const sidebar = { 'migration/global-api-treeshaking', 'migration/inline-template-attribute', 'migration/keycode-modifiers', + 'migration/props-default-this', 'migration/render-function-api', 'migration/slots-unification', 'migration/transition', diff --git a/src/guide/migration/props-default-this.md b/src/guide/migration/props-default-this.md new file mode 100644 index 00000000..223c55e0 --- /dev/null +++ b/src/guide/migration/props-default-this.md @@ -0,0 +1,32 @@ +--- +title: Props Default Function this Access +badges: + - breaking +--- + +# Props Default Function `this` Access + +Props default value factory functions no longer have access to `this`. + +Instead: + +- Raw props received by the component are passed to the default function as argument; + +- The [inject](../composition-api-provide-inject.md) API can be used inside default functions. + +```js +import { inject } from 'vue' + +export default { + props: { + theme: { + default (props) { + // `props` is the raw values passed to the component, + // before any type / default coercions + // can also use `inject` to access injected properties + return inject('theme', 'default-theme') + } + } + } +} +``` \ No newline at end of file From b79990c14f28f30e2f99682dbe87f31011d16cc1 Mon Sep 17 00:00:00 2001 From: daisuke Date: Sun, 8 Nov 2020 18:14:41 +0900 Subject: [PATCH 2/2] =?UTF-8?q?Migration=20Guide=20>=20Props=20Default=20F?= =?UTF-8?q?unction=20`this`=20Access=20=E3=81=AE=E7=BF=BB=E8=A8=B3=20(#122?= =?UTF-8?q?)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/guide/migration/props-default-this.md | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/src/guide/migration/props-default-this.md b/src/guide/migration/props-default-this.md index 223c55e0..2c7b4b94 100644 --- a/src/guide/migration/props-default-this.md +++ b/src/guide/migration/props-default-this.md @@ -1,18 +1,18 @@ --- -title: Props Default Function this Access +title: プロパティのデフォルト値ファクトリ関数の `this` アクセス badges: - breaking --- -# Props Default Function `this` Access +# プロパティのデフォルト値ファクトリ関数の `this` アクセス -Props default value factory functions no longer have access to `this`. +プロパティのデフォルト値ファクトリ関数が `this` にアクセスできなくなりました。 -Instead: +代わりの方法は以下です。 -- Raw props received by the component are passed to the default function as argument; +- コンポーネントが受け取った生のプロパティは、引数としてデフォルト関数に渡されます。 -- The [inject](../composition-api-provide-inject.md) API can be used inside default functions. +- [inject](../composition-api-provide-inject.md) API がデフォルト関数の内部で使用できます。 ```js import { inject } from 'vue' @@ -21,9 +21,9 @@ export default { props: { theme: { default (props) { - // `props` is the raw values passed to the component, - // before any type / default coercions - // can also use `inject` to access injected properties + // `props` 引数はコンポーネントに渡される生の値で、 + // 型やデフォルトの強制より前のものです。 + // また、`inject` を使用して注入されたプロパティにアクセスすることもできます。 return inject('theme', 'default-theme') } }