diff --git a/src/README.md b/src/README.md index a497bd228f..d537873e8d 100644 --- a/src/README.md +++ b/src/README.md @@ -11,7 +11,7 @@ actionButtons: - text: Get Started link: /guide/introduction - text: GitHub - link: https://github.com/vuejs/vue + link: https://github.com/vuejs/vue-next extraClass: github grey icon: fa fa-github target: _blank @@ -30,7 +30,7 @@ footer: | Copyright © 2014-2020 Evan You socialIcons: - type: GitHub - link: https://github.com/vuejs/vue + link: https://github.com/vuejs/vue-next - type: Twitter link: https://twitter.com/vuejs - type: Medium diff --git a/src/guide/migration/custom-directives.md b/src/guide/migration/custom-directives.md index 0dbec65558..7e16c55131 100644 --- a/src/guide/migration/custom-directives.md +++ b/src/guide/migration/custom-directives.md @@ -10,7 +10,6 @@ badges: Here is a quick summary of what has changed: - API has been renamed to better align with component lifecycle -- Custom directives will be controlled by child component via `v-bind="$attrs"` For more information, read on! @@ -103,26 +102,6 @@ mounted(el, binding, vnode) { } ``` -## Implementation Details - -In Vue 3, we're now supporting fragments, which allow us to return more than one DOM node per component. You can imagine how handy that is for something like a component with multiple `
  • ` elements or the children elements of a table: - -```html - -``` - -As wonderfully flexible as this is, we can potentially encounter a problem with a custom directive that could have multiple root nodes. - -As a result, custom directives are now included as part of a virtual DOM node’s data. When a custom directive is used on a component, hooks are passed down to the component as extraneous props and end up in `this.$attrs`. - -This also means it's possible to directly hook into an element's lifecycle like this in the template, which can be handy when a custom directive is too involved: - -```html -
    -``` - -This is consistent with the attribute fallthrough behavior, so when a child component uses `v-bind="$attrs"` on an inner element, it will apply any custom directives used on it as well. +:::warning +With [fragments](/guide/migration/fragments.html#overview) support, components can potentially have more than one root nodes. When applied to a multi-root component, directive will be ignored and the warning will be thrown. +:::