关于vue3:onMounted-is-called-when-there-is-no-active-component-已解决

最近写vue3+ts和组合式API遇到了下面的问题，代码如下：

<template>
  
</template>

<script setup lang="ts">
import { useStore } from 'vuex'
import { useRoute } from 'vue-router'
import { onMounted } from 'vue'

const store = useStore()
store.dispatch('initMenus')

const route = useRoute()

onMounted(() =>{
    console.log(route.path)
})

</script>

<style lang="scss" scoped>

</style>

这个是因为在这个组合式onMounted之前调用了store.dispatch(‘initMenus’) 外部蕴含async/await

解决办法：

If you are using async setup(), make sure to register lifecycle hooks before the first await statement.

只有把代码程序调整如下，报错即可隐没：

<template>
  
</template>

<script setup lang="ts">
import { useStore } from 'vuex'
import { useRoute } from 'vue-router'
import { onMounted } from 'vue'

const route = useRoute()

onMounted(() =>{
    console.log(route.path)
})

const store = useStore()
store.dispatch('initMenus')

</script>

<style lang="scss" scoped>

</style>

心愿能够帮到你。