【问题标题】:Using Vue Components in Moqui Screens在 Moqui 屏幕中使用 Vue 组件
【发布时间】:2017-07-19 21:28:10
【问题描述】:

是否可以在 Moqui 屏幕中使用 VusJS 组件? 我确定您可以呈现基本 HTML,但我找不到 VueJS 应用程序的挂钩。

需求来自以下场景: 虽然 form-single 小部件可以折叠,但 form-list 不能。所以我想使用 vue-collapsible (https://github.com/vue-comps/vue-collapsible) 但我不知道应该在哪里注册组件。

如果没有办法使用 vue,也许你可以帮助我解决我的具体问题。

【问题讨论】:

    标签: vue.js moqui


    【解决方案1】:

    在 /vapps 路径(与 /apps 相对)中使用的“vuet”渲染模式中,它实际上并不是发送给客户端的 HTML,它是一个 Vue 模板。如果您查看服务器返回的文本,您会看到许多 Vue 组件已经在使用(请参阅 WebrootVue.js 文件以获取它们的源代码)。您可以使用工具窗口中的“源”或“网络”选项卡或其他浏览器中的类似工具在 Chrome 中查看此内容。如果您检查一个元素,您将看到呈现的 HTML,即在 Vue 运行组件以将 Vue 模板更改为 HTML 之后。

    这意味着如果您包含必要的 JavaScript 文件和 CSS 文件(如果需要),那么您可以在返回的 Vue 模板中使用任何 Vue 组件。您可以使用带有 @type=vuet 的 render-mode.text 元素在 XML 屏幕文件中内联执行此操作。

    这些都不是在 NPM 下运行的,就像 VueJS 通过 XML 屏幕在 Moqui 框架中使用的方式一样。换句话说,它不是具有 100% 客户端/浏览器渲染的预打包 Vue 应用程序,而是一种混合客户端和服务器渲染方法。

    您可以在这种 Moqui 混合方法中包含脚本,使用带有 @src 属性的脚本元素,用于 WebrootVue.js 文件动态加载的脚本文件。对于其他 JS 脚本,例如 Chart.JS,有各种示例

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2019-08-07
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-10-17
      • 2018-03-05
      相关资源
      最近更新 更多