Skip to content

Fragment component #449

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 4 commits into
base: master
Choose a base branch
from
Open
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Prev Previous commit
Add a case for custom directives
  • Loading branch information
CyberAP authored May 17, 2022
commit d247ff3a37a2565148156d2758b2cb87e6713909
10 changes: 10 additions & 0 deletions active-rfcs/0000-fragment-component.md
Original file line number Diff line number Diff line change
Expand Up @@ -34,6 +34,16 @@ Add `fragment` built-in component that acts as a `<template>` empty wrapper tag.

There are cases when some markup should be conditionally wrapped within a tag\component or not wrapped at all. Right now you have 2 options on how to deal with that: either duplicate the markup or extract that code into a separate component. Both are not ideal: duplicate code is invisibly coupled (changes in one copy should be reflected in all other copies), extracting into component is cumbersome. It gets more tedious when you have multiple of those cases in a single component.

You might also want to create your own kind of `fragment` component. But it will recieve all the custom directives from the parent, which will result in errors.

Example:

```html
<component :is="shouldWrap ? 'div' : 'MyFragmentComponent'" v-custom-directive>
<img src="cat.jpg" alt="Cat">
</component>
```

# Detailed design

`<component is="fragment">` should be compiled into `h('fragment')`. Vue renderer should be updated accordingly to support rendering fragments that way.
Expand Down