diff --git a/src/.vuepress/config.js b/src/.vuepress/config.js index 0bada200..1267a37c 100644 --- a/src/.vuepress/config.js +++ b/src/.vuepress/config.js @@ -195,7 +195,7 @@ const sidebar = { '/guide/migration/keycode-modifiers', '/guide/migration/listeners-removed', '/guide/migration/mount-changes', - // '/guide/migration/props-data', + '/guide/migration/props-data', '/guide/migration/props-default-this', '/guide/migration/render-function-api', '/guide/migration/slots-unification', diff --git a/src/guide/migration/props-data.md b/src/guide/migration/props-data.md new file mode 100644 index 00000000..080261b6 --- /dev/null +++ b/src/guide/migration/props-data.md @@ -0,0 +1,41 @@ +--- +badges: + - removed +--- + +# `propsData` + +## 概要 + +Vue インスタンスの生成時に props を渡すために使われていた `propsData` オプションは削除されました。Vue 3 アプリケーションのルートコンポーネントに props を渡すには、 [createApp](/api/global-api.html#createapp) の第2引数を使います。 + +## 2.x での構文 + +2.x では、 Vue インスタンスの生成時に props を渡すことができました: + +```js +const Comp = Vue.extend({ + props: ['username'], + template: '
{{ username }}
' +}) + +new Comp({ + propsData: { + username: 'Evan' + } +}) +``` + +## 3.x での更新 + +`propsData` オプションは削除されました。生成時にルートコンポーネントのインスタンスに props を渡す必要がある場合は、 `createApp` の第2引数を使ってください: + +```js +const app = createApp( + { + props: ['username'], + template: '
{{ username }}
' + }, + { username: 'Evan' } +) +```