From 89548b553dafab1e004013a2fb0ce6b7bdabd972 Mon Sep 17 00:00:00 2001 From: Ben Hong Date: Mon, 13 Jul 2020 11:15:17 -0400 Subject: [PATCH 1/5] refactor (#153): move migration introduction into folder --- src/.vuepress/config.js | 2 +- src/guide/{migration.md => migration/introduction.md} | 4 +++- 2 files changed, 4 insertions(+), 2 deletions(-) rename src/guide/{migration.md => migration/introduction.md} (99%) diff --git a/src/.vuepress/config.js b/src/.vuepress/config.js index d63c785b49..59c997a74d 100644 --- a/src/.vuepress/config.js +++ b/src/.vuepress/config.js @@ -87,7 +87,7 @@ const sidebar = { title: 'Migration to Vue 3', collapsable: true, children: [ - 'migration', + 'migration/introduction', 'migration/global-api', 'migration/treeshaking', 'migration/functional-components', diff --git a/src/guide/migration.md b/src/guide/migration/introduction.md similarity index 99% rename from src/guide/migration.md rename to src/guide/migration/introduction.md index 550c461aee..c20b8427d6 100644 --- a/src/guide/migration.md +++ b/src/guide/migration/introduction.md @@ -1,4 +1,4 @@ -# Migration +# Introduction > There's so much here! Does that mean 3.0 is completely different, I'll have to learn the basics all over again, and migrating will be practically impossible? @@ -38,6 +38,8 @@ It depends on a few factors: [//]: # 'TODO: still need to see where this lands' +## Overview + ## Built-in Directives ### `v-model` API Change From b6b2e3bddff71402ee84ced5bf3606504618814d Mon Sep 17 00:00:00 2001 From: Ben Hong Date: Mon, 13 Jul 2020 11:42:32 -0400 Subject: [PATCH 2/5] docs (#153): add keycodes deprecated section --- src/guide/migration/introduction.md | 6 ++++ src/guide/migration/keycodes.md | 51 +++++++++++++++++++++++++++++ 2 files changed, 57 insertions(+) create mode 100644 src/guide/migration/keycodes.md diff --git a/src/guide/migration/introduction.md b/src/guide/migration/introduction.md index c20b8427d6..368f478ff6 100644 --- a/src/guide/migration/introduction.md +++ b/src/guide/migration/introduction.md @@ -40,6 +40,12 @@ It depends on a few factors: ## Overview +### Deprecated + +The following features are now deprecated from v2: + +- **keyCode support as `v-on` modifiers.** For more information, [see in-depth explanation](/guides/migration/keycodes.html) + ## Built-in Directives ### `v-model` API Change diff --git a/src/guide/migration/keycodes.md b/src/guide/migration/keycodes.md new file mode 100644 index 0000000000..fc6af67d42 --- /dev/null +++ b/src/guide/migration/keycodes.md @@ -0,0 +1,51 @@ +# Remove keyCode support in v-on + +## Overview + +Here is a quick summary of what has changed: + +- **DEPRECATED**: Using numbers, i.e. keyCodes, as `v-on` modifiers +- **DEPRECATED**: Support for `config.keyCodes` + +## Previous Syntax + +In Vue 2, keyCodes were supported as a way to modify a `v-on` method. + +```html + + + + + +``` + +In addition, you could define your own aliases via the global `config.keyCodes` option. + +```js +Vue.config.keyCodes = { + f1: 112 +} +``` + +```html + + + + + +``` + +## Current Syntax + +Since [`KeyboardEvent.keyCode` has been deprecated](https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/keyCode), it no longer makes sense for Vue 3 to continue supporting this as well. As a result, it is now recommended to use the kebab-case name for any key you want to use as a modifier. + +```html + + +``` + +As a result, this means that `config.keyCodes` is now also deprecated and will no longer be supported. + +## How to Migrate + +For those using `keyCode` in their codbase, we recommend converting them to their kebab-cased named equivalents. From ebd3a3f5ea0ccfb2a8756e7745fdd41871e89f26 Mon Sep 17 00:00:00 2001 From: Ben Hong Date: Mon, 13 Jul 2020 11:56:59 -0400 Subject: [PATCH 3/5] docs (#153): update keycode file naming and terminology --- src/.vuepress/config.js | 3 ++- src/guide/migration/{keycodes.md => keycode-modifiers.md} | 6 +++--- 2 files changed, 5 insertions(+), 4 deletions(-) rename src/guide/migration/{keycodes.md => keycode-modifiers.md} (87%) diff --git a/src/.vuepress/config.js b/src/.vuepress/config.js index 59c997a74d..3b6bc1d4d8 100644 --- a/src/.vuepress/config.js +++ b/src/.vuepress/config.js @@ -91,7 +91,8 @@ const sidebar = { 'migration/global-api', 'migration/treeshaking', 'migration/functional-components', - 'migration/async-components' + 'migration/async-components', + 'migration/keycode-modifiers' ] }, { diff --git a/src/guide/migration/keycodes.md b/src/guide/migration/keycode-modifiers.md similarity index 87% rename from src/guide/migration/keycodes.md rename to src/guide/migration/keycode-modifiers.md index fc6af67d42..a85f4ce963 100644 --- a/src/guide/migration/keycodes.md +++ b/src/guide/migration/keycode-modifiers.md @@ -1,11 +1,11 @@ -# Remove keyCode support in v-on +# KeyCode Modifiers ## Overview Here is a quick summary of what has changed: -- **DEPRECATED**: Using numbers, i.e. keyCodes, as `v-on` modifiers -- **DEPRECATED**: Support for `config.keyCodes` +- **BREAKING**: Using numbers, i.e. keyCodes, as `v-on` modifiers are no longer supported +- **BREAKING**: `config.keyCodes` is no longer supported ## Previous Syntax From c76d7da33d5f7b22d0f78f7daed05de821353e3a Mon Sep 17 00:00:00 2001 From: Ben Hong Date: Mon, 13 Jul 2020 13:10:31 -0400 Subject: [PATCH 4/5] docs: fix grammar Co-authored-by: Natalia Tepluhina --- src/guide/migration/keycode-modifiers.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/guide/migration/keycode-modifiers.md b/src/guide/migration/keycode-modifiers.md index a85f4ce963..092e961e5a 100644 --- a/src/guide/migration/keycode-modifiers.md +++ b/src/guide/migration/keycode-modifiers.md @@ -4,7 +4,7 @@ Here is a quick summary of what has changed: -- **BREAKING**: Using numbers, i.e. keyCodes, as `v-on` modifiers are no longer supported +- **BREAKING**: Using numbers, i.e. keyCodes, as `v-on` modifiers is no longer supported - **BREAKING**: `config.keyCodes` is no longer supported ## Previous Syntax From 30b2223fcc6801351a239aed95768ec963ff4eb2 Mon Sep 17 00:00:00 2001 From: Ben Hong Date: Mon, 13 Jul 2020 13:10:52 -0400 Subject: [PATCH 5/5] docs: improve display Co-authored-by: Natalia Tepluhina --- src/guide/migration/keycode-modifiers.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/guide/migration/keycode-modifiers.md b/src/guide/migration/keycode-modifiers.md index 092e961e5a..8c3a7519e5 100644 --- a/src/guide/migration/keycode-modifiers.md +++ b/src/guide/migration/keycode-modifiers.md @@ -9,7 +9,7 @@ Here is a quick summary of what has changed: ## Previous Syntax -In Vue 2, keyCodes were supported as a way to modify a `v-on` method. +In Vue 2, `keyCodes` were supported as a way to modify a `v-on` method. ```html