Options: Misc#

name#

Explicitly declare a display name for the component.

• Type

ts interface ComponentOptions { name?: string }

• Details

The name of a component is used for the following:

• Recursive self-reference in the component's own template
• Display in Vue DevTools' component inspection tree
• Display in warning component traces

When you use Single-File Components, the component already infers its own name from the filename. For example, a file named MyComponent.vue will have the inferred display name "MyComponent".

Another case is that when a component is registered globally with app.component, the global ID is automatically set as its name.

The name option allows you to override the inferred name, or to explicitly provide a name when no name can be inferred (e.g. when not using build tools, or an inlined non-SFC component).

There is one case where name is explicitly necessary: when matching against cacheable components in <KeepAlive> via its include / exclude props.

:::tip Since version 3.2.34, a single-file component using <script setup> will automatically infer its name option based on the filename, removing the need to manually declare the name even when used with <KeepAlive>. :::

inheritAttrs#

Controls whether the default component attribute fallthrough behavior should be enabled.

• Type

ts interface ComponentOptions { inheritAttrs?: boolean // default: true }

• Details

By default, parent scope attribute bindings that are not recognized as props will "fallthrough". This means that when we have a single-root component, these bindings will be applied to the root element of the child component as normal HTML attributes. When authoring a component that wraps a target element or another component, this may not always be the desired behavior. By setting inheritAttrs to false, this default behavior can be disabled. The attributes are available via the $attrs instance property and can be explicitly bound to a non-root element using v-bind.

• Example

• See also

• Fallthrough Attributes
  

  - [Using `inheritAttrs` in normal `