Vue3.2 报错使用onMounted 警告并初始化失败 onMounted is called when there is no active component instance to be

vue3使用生命周期onMounted 等警告不生效等onMounted is called when there is no active component instance to be associated with.

文章共291字 · 阅读需要大约1分钟

一键AI生成摘要，助你高效阅读

问答

Alastor_L

9188人浏览 · 2023-06-05 17:32:51

Alastor_L · 2023-06-05 17:32:51 发布

警告内容:
[Vue warn]: onMounted is called when there is no active component instance to be associated with. Lifecycle injection APIs can only be used during execution of setup(). If you are using async setup(), make sure to register lifecycle hooks before the first await statement. at

意思是onMounted 被调用时，当前并没有活跃状态的组件实例去处理生命周期钩子的注入。生命周期钩子的注入只能在 setup 同步执行期间进行，使用async setup（），请确保在第一个await语句之前注册生命周期 .。

我使用的是setup语法糖,可能存在异步任务组件变为异步组件了

解决方案:
将onMounted 函数放在最前面

import {onMounted, reactive, ref} from "vue"
onMounted(() => {
    getGridWidth()
    window.onresize = () => {
        getGridWidth()
    }
})
const spinning = ref<boolean>(true)