Skip to content

Commit

Permalink
docs: consist usage of in-DOM template (#2521)
Browse files Browse the repository at this point in the history
  • Loading branch information
jay-es authored Oct 17, 2023
1 parent 6e3fac2 commit b949158
Show file tree
Hide file tree
Showing 2 changed files with 3 additions and 3 deletions.
2 changes: 1 addition & 1 deletion src/guide/components/registration.md
Original file line number Diff line number Diff line change
Expand Up @@ -136,6 +136,6 @@ Throughout the guide, we are using PascalCase names when registering components.

2. `<PascalCase />` makes it more obvious that this is a Vue component instead of a native HTML element in templates. It also differentiates Vue components from custom elements (web components).

This is the recommended style when working with SFC or string templates. However, as discussed in [in-DOM Template Parsing Caveats](/guide/essentials/component-basics#in-dom-template-parsing-caveats), PascalCase tags are not usable in DOM templates.
This is the recommended style when working with SFC or string templates. However, as discussed in [in-DOM Template Parsing Caveats](/guide/essentials/component-basics#in-dom-template-parsing-caveats), PascalCase tags are not usable in in-DOM templates.

Luckily, Vue supports resolving kebab-case tags to components registered using PascalCase. This means a component registered as `MyComponent` can be referenced in the template via both `<MyComponent>` and `<my-component>`. This allows us to use the same JavaScript component registration code regardless of template source.
4 changes: 2 additions & 2 deletions src/style-guide/rules-strongly-recommended.md
Original file line number Diff line number Diff line change
Expand Up @@ -352,7 +352,7 @@ Unfortunately, HTML doesn't allow custom elements to be self-closing - only [off
```

```vue-html
<!-- In DOM templates -->
<!-- In in-DOM templates -->
<my-component/>
```

Expand All @@ -367,7 +367,7 @@ Unfortunately, HTML doesn't allow custom elements to be self-closing - only [off
```

```vue-html
<!-- In DOM templates -->
<!-- In in-DOM templates -->
<my-component></my-component>
```

Expand Down

0 comments on commit b949158

Please sign in to comment.