Vue.js Vue 3 Instant根组件，其数据在Promise之后

我需要使用Promise返回的数据（item对象）初始化Vue 3应用程序，并从所有组件访问它。 取回的项目应先传递给应用程序，然后再传递其他内容

import { createApp } from 'vue';
import store from "../store";
import DetailPage from '../views/DetailPage.vue'

my_promise().then(fetched_item => {
    const app =  createApp(DetailPage)
    app.item = fetched_item // this doesn't works
    const vm = app.use(store).mount('#app')
})
 

detailpage.vue

<template>
    <navbar-component></navbar-component>
</template>

<script>
import NavBar from '@/components/detailpage/NavBar.vue'
    export default {
      name: 'DetailPage',
      data(){
        return {
          item: {text: 'default'}
        }
      },
     components: {
       'navbar-component': NavBar
     }
    }
    </script>

我明白了

不是在初始化时传递的获取项，而是返回，但您需要（即，

app.mount（）

）的结果，它允许访问组件的数据属性：

const-app=createApp（DetailPage）
const vm=app.use（store.mount）（“#app”）
vm.item=获取的\u项

您的应用程序是SPA吗？如果是，您可以在其中一个vue路由器挂钩（例如beforeRouteEnter）中添加一个条件来获取此数据（如果尚未获取），然后将其存储在一个状态中，以便您的其他组件可以访问它。否，它是一个chrome扩展（内容脚本）

mounted(){
    console.log("root", this.$root.item)
}

Proxy {text: "default"}