作为一个子页面挂载
页面要可用,需要作为子页面添加在一个已在根页面下的页面下。 在Moqui页面体系中,到页面的URL路径和菜单结构都由子页面层级驱动,页面(作为子页面)添加后,将设置它的URL并为它添加一个菜单tab。
简单起见,我们将使用现有的根页面和 runtime 目录包含的header/footer等。runtime 目录在以下位置有一个带根页面的 webroot 组件:
runtime/base-component/webroot/screen/webroot.xml
根页面在Moqui配置XML文件中用 webapp-list.webapp.root-screen 元素指定,可以用多个元素为不同的主机名指定不同的根页面。更多关于Moqui配置XML文件的内容可查阅 运行和部署。
为了让页面层级更灵活,根页面只有一个基本的HTML head和body,没有header和footer内容,我们把页面放在 apps 页面下,该页面有一个header菜单,将带给我们的页面一些上下文信息。
在 用户界面 => XML页面中描述了把一个页面做成另一个页面的子页面的4种方式。本教程将使用组件的MoquiConf.xml文件的方式,它将在Moqui启动时和其他组件中的MoquiConf.xml文件、启动时命令行参数中的运行时Moqui配置XML文件一起与框架里的MqouiDefaultConf.xml文件合并。这是添加一个新应用到Moqui的推荐方式,PopCommerce、HiveMind等也是用的这种方式。
添加一个MoquiConf.xml文件到组件的根目录:
runtime/component/tutorial/MoquiConf.xml
尽管挂载一个子页面可以包含任意Moqui配置文件中支持的内容(见moqui-conf-2.1.xsd),但这里只用了 screen-facade.screen 元素,像这样:
<?xml version="1.0" encoding="UTF-8" ?>
<moqui-conf xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceSchemaLocation="http://moqui.org/xsd/moqui-conf-2.1.xsd">
<screen-facade>
<screen location="component://webroot/screen/webroot/apps.xml">
<subscreens-item name="tutorial" menu-title="Tutorial" menu-index="99"
location="component://tutorial/screen/tutorial.xml"/>
</screen>
</screen-facade>
</moqui-conf>
组件到位后就可以启动Moqui了(用java -jar moqui.war等等)
subscreen-item.name 属性指定页面在URL中的路径,你的页面现在可以通过浏览器里在这里访问到:
http://localhost:8080/apps/tutorial
也可以在新的基于VueJS的混合服务器、客户端应用wrapper(/vapps)中访问到它。页面路径使用挂载在/apps下的: