我如何嵌套Vue应用
我试图将VUE应用程序嵌入到已经是Toplevel Div的VUE应用的网站中。 主要网站是动态网站（CMS）。在Toplevel上，有一个DIV（VUEAPP），该Div转换为VUE应用程序。
现在，我还拥有一个使用其自己的JavaScript（并且正在托管）的嵌套VUE应用程序。这个嵌套的应用 完全位于主VUE应用程序的HTML内部（请参见下面的结构）
现在有两个问题：
- 嵌套的应用程序安装在主VueApp后不起作用。事件似乎是断开连接的。因此看起来不错，但是点击未处理。嵌套应用不嵌套时正在工作。
- Vue抱怨Vueapp Div中的脚本标签。
<html>
<body>
<div id="vueApp">
<script scr="nestedApp.js" type=module />
<div id="nestedApp"></div>
</div>
<script scr="vueApp.js" />
</body>
</html>
I am trying to embed a vue app in a website which already is a Vue app of the toplevel div.
The main website is a dynamic website (CMS). On toplevel there is a div (vueApp) which is converted to a vue app.
Now I also have a nested vue application which uses it's own javascript (and is hosting). This nested app
is entirely inside the html of main vue app (see structure below)
Now 1 have two problems:
- The nested app does not work after the main vueApp is mounted. The events seems to disconnected. So it looks fine but clicks are not handled. The nested app is working when it is not nested.
- Vue complains about the script tag inside the vueApp div.
<html>
<body>
<div id="vueApp">
<script scr="nestedApp.js" type=module />
<div id="nestedApp"></div>
</div>
<script scr="vueApp.js" />
</body>
</html>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
您需要实现事件总线以在两个应用程序之间进行通信。另一个选项可能是从第二个应用程序派遣自定义事件，并在主应用中添加相应的事件侦听器。
我会和公共汽车一起去，尽管这是一种更复杂的方法。
顺便说一句，您是否尝试过将嵌套应用程序作为主要应用程序的子组件安装？这样，您不必添加第二个脚本标签，就可以为嵌套应用程序提供外部依赖项，例如事件总线。
You need to implement an event bus to communicate between two apps. Another option could be to dispatch custom events from the second app and add corresponding event listeners in your main app.
I would go with the bus, although it's a more complicated way.
By the way, have you tried mounting your nested app as a child component of you main app? This way you don't have to add the second script tag and you can provide external dependencies to you nested app, e.g the event bus.