vue3 ts组合式API异常onMounted is called when there is no active component解决
更新时间：2023年05月24日 09:02:20 作者：来了老弟
这篇文章主要为大家介绍了vue3 ts组合式API异常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>希望可以帮到你。
以上就是vue3 ts组合式API异常onMounted is called when there is no active component解决的详细内容，更多关于vue3 ts组合式API异常的资料请关注脚本之家其它相关文章！
相关文章
本文主要介绍了Vue3和Electron实现桌面端应用详解，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2021-07-07
Vue Router是Vue.js官方的路由管理器。它和Vue.js的核心深度集成，让构建单页面应用变得易如反掌。路由实际上就是可以理解为指向，就是我在页面上点击一个按钮需要跳转到对应的页面，这就是路由跳转2023-01-01
这篇文章主要介绍了vue自定义组件@click点击失效问题及解决方案，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
本文主要介绍了vue项目打包成桌面快捷方式(electron)的方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2022-06-06
这篇文章主要介绍了vue 组件通信的几种方式,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-03-03
这篇文章主要介绍了Vue页面刷新记住页面状态的实现，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2019-12-12
这篇文章主要介绍了vue3的setup的使用和原理,结合实例形式详细分析了vue3 setup的基本功能、原理与使用方法,需要的朋友可以参考下2023-06-06
我们都知道跨域是同源策略导致的,域名不同、协议不同、端口号不同任意一种情况都会导致跨域,这篇文章主要介绍了从Vue到Postman全面验证API接口跨域问题,需要的朋友可以参考下2024-08-08
这篇文章主要介绍了解决vuex刷新状态初始化的方法实现,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2019-08-08
vue自定义组件如何通过v-model指令控制组件的隐藏、显示
这篇文章主要介绍了vue自定义组件如何通过v-model指令控制组件的隐藏、显示，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-05-05
最新评论