[英]how to know when dynamic component has fully loaded
所以我正在動態加載一些組件:
const Page0 = () => import("@/components/pages/tutorial/Pages/Page0")
const Page1 = () => import("@/components/pages/tutorial/Pages/Page1")
還有10個這樣的頁面,將根據路徑參數調用。
我想知道如何加載某個頁面,以創建加載屏幕,以及如何知道它何時被切換。
這就是我完全使用它的方式。
<template>
<div>
<component :is="current_page"></component>
</div>
</template>
<script>
const Page0 = () => import("@/components/pages/tutorial/Pages/Page0/index.vue")
const Page1 = () => import("@/components/pages/tutorial/Pages/Page1/index.vue")
export default {
scrollToTop:
true,
components:
{
Page0,
Page1,
},
computed:
{
current_page ()
{
return "Page" + this.page
}
},
asyncData ({
route, store, env, params, query, req, res, redirect, error
})
{
return {
page:
params.page
}
}
}
</script>
如何知道動態組件何時滿載?
您可以為每個組件動態使用@hook:mounted
, 或者不指示組件已加載。
例如
<component :is="current_page" @hook:mounted="doSomething"></component>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.