如何在vue js 3.0中获取当前组件名称

Question

我可以通过以下方式获取 vue js 2 中的组件名称：this.$options.name。如何在 vue js 3 中获取它？

谢谢。

Answer 1

我设法在运行时获取组件名称，如下所示：

<script setup lang="ts">
import {getCurrentInstance} from 'vue'

const componentName = getCurrentInstance()?.type.__name
</script>

Answer 2

设法使用：this.$parent.componentName 来获取它。

<script lang="ts">
import {Options, Vue} from 'vue-class-component';
import HelloWorld from '@/components/HelloWorld.vue';
import {Prop} from "vue-property-decorator";
import {Product} from "@/store/models";

@Options({
  components: {
    HelloWorld,
  },
  mounted() {
    this.$emit('init', this.$parent.componentName + ' mounted')
  },
  emits: ['init']
})
export default class Home extends Vue {

  @Prop(Array) private readonly products!: Product[];

}
</script>