javascript - 运行 MelonJS 游戏的 VueJS 组件

Question

我正在使用 VueJS 制作一个应用程序，该应用程序使用 MelonJS 启动游戏，然后将分数传递给 mongoDB 数据库。

目前，我有一个 .vue 组件，我想将游戏注入其中。

这是游戏应该启动的地方

</template>

<style>
#game-screen {
  background-color: blue;
}
</style>

<script>


</script>

divscreen是运行游戏的地方。原始游戏缩小文件，并在 index.html 文件中将其注入到该 div 中。

在需要或导入脚本文件时我很困惑。Vue 是否支持在组件中使用如此大的代码块？如果我链接新项目 html 文件中的文件，一旦组件加载，它将可以访问 js 和 css 文件吗？

我有一个想法，我可以将它们要求到组件中，并且它的行为就像 html 文件一样。

score 0 · Accepted Answer

添加一个正确的答案，这样如果它有效，你就有可以接受的东西，以及更多的采购。

每个 Vue 都有一个el——你要绑定的元素——以及像ready这样的事件

在 melon 中，您提供一个el（这是他们称为包装器的可选 div）来渲染您的元素，因此您应该能够创建一个需要所有游戏文件的 Vue，其 el 为“#screen”，并且当 ready 事件触发时触发 game.onload() ，它将渲染到提供的选择器（在本例中为屏幕）