Ability to get the current component's name

[jasonvarga]

We have a use case where we need to get the name of the current component. Typically within a mixin.

In Vue 2 we could do this.$options.name and it would return something like my-component.

In Vue 3 there doesn't seem to be a way to do that. Is there?

---

Some more detailed context...
We have a system where third party developers can inject logic into other components. Here's some pseudocode:

registerCustomLogic('example-component', () => { ... });

Within our components we'd have something like:

const customFunction = getCustomLogic(this.$options.name);

Obviously there's more to it, and all of that is encapsulated within a mixin.

These components are all globally registered, so the names have already been defined.

app.component('example-component-one', ExampleComponentOne);
app.component('example-component-two', ExampleComponentTwo);

It feels awkward to have to add a new property to every component just to be able to get the name.

// ExampleComponentOne.vue
{ 
  mixins: [HandlesCustomLogic],
+  data() {
+    return {
+      componentName: 'example-component-one'
+    };
+  }
}

// HandlesCustomLogic.js
-const customFunction = getCustomLogic(this.$options.name);
+const customFunction = getCustomLogic(this.componentName);

It doesn't really matter if the name is example-component-one or ExampleComponentOne. As long as there's a consistent way to get it. I see things like __file and __name sometimes but they disappear when compiling for production.

Any help would be appreciated! 🙏

[edison1105]

In Vue 3 there doesn't seem to be a way to do that. Is there?

use const compName = getCurrentInstance().type.__name
see playground

[jasonvarga]

Thank you, that would be perfect but __name is undefined when using the options API.