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..2c7b4b94 --- /dev/null +++ b/src/guide/migration/props-default-this.md @@ -0,0 +1,32 @@ +--- +title: プロパティのデフォルト値ファクトリ関数の `this` アクセス +badges: + - breaking +--- + +# プロパティのデフォルト値ファクトリ関数の `this` アクセス + +プロパティのデフォルト値ファクトリ関数が `this` にアクセスできなくなりました。 + +代わりの方法は以下です。 + +- コンポーネントが受け取った生のプロパティは、引数としてデフォルト関数に渡されます。 + +- [inject](../composition-api-provide-inject.md) API がデフォルト関数の内部で使用できます。 + +```js +import { inject } from 'vue' + +export default { + props: { + theme: { + default (props) { + // `props` 引数はコンポーネントに渡される生の値で、 + // 型やデフォルトの強制より前のものです。 + // また、`inject` を使用して注入されたプロパティにアクセスすることもできます。 + return inject('theme', 'default-theme') + } + } + } +} +``` \ No newline at end of file