将数据传递给 createApp (vue)

Question

使用 Webpack，我有这个代码：

    import { createApp } from 'vue'
    import Vue from 'vue'
    import App from './components/ItemSearch/ItemSearch.vue'
    
    createApp(App).mount('#search-app')

在我的网站上，我有一个搜索应用程序页面，其中包含 <div id="search-app" /> 以将应用程序的根安装到。

我想知道的是，是否有可能以某种方式从包含 javascript 文件的页面插入（最好）一些数据？我想从数据库中包含一些项目，例如设置和搜索类别，如果可以的话，我想避免对它们发出 AJAX 请求。

有什么帮助吗？或者有什么方法可以在加载时内联包含此数据？

使用 Webpack，我不太明白如何从加载 javascript 文件的页面访问应用程序，以便我可以在以某种方式将其传递给之前修改 data createApp()，或者如果可能的话。我可以在浏览器加载的页面上使用 import 语句吗，或者这只是 Webpack 独有的（或类似的）功能吗？

非常感谢。

Answer 1

可以使用createApp的第二个参数来传递道具

import { createApp } from 'vue'
import Vue from 'vue'
import App from './components/ItemSearch/ItemSearch.vue'
    
createApp(App, {myProp: "value"}).mount('#search-app')

docs

将数据传递给 createApp (vue)

Passing data to createApp (vue)

vuejs3