共计 771 个字符,预计需要花费 2 分钟才能阅读完成。
最近写 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>
心愿能够帮到你。
正文完