桌面端移动端共用页面
在桌面端开发的页面,如果希望在移动端也可以使用,或者反过来,在移动端开发的页面,在桌面端使用。通过在应用资源管理中配置即可。
如果一个功能在桌面端和移动端都开发了页面,作为一个权限项,在服务元信息文件中对应一个 Url,这个 Url 默认采用移动端路径格式,即:/应用名/mobileapp/mobile/文件路径
- 在移动端浏览器中打开时,系统直接使用此 Url 打开页面
- 在桌面端浏览器中打开时,系统将路径自动转换为桌面端路径格式,即:/应用名/pcxapp/pcx/文件路径,再打开页面
对于只开发了一个端的页面,需要在两个端都打开时,只需要将页面模式设置为外部页面,即系统不根据当前端对 Url 进行转换即可
注意: 在某些场景下,直接打开页面,会存在对应页面不存在的问题,例如直接打开权限管理页面,调用移动端的图标选择页面。要解决该问题,需要在权限管理页面初始方法中操作“window.microService.menus”(页面相关识别校验就是通过改变量),例如:
//兼容在云ide下打开移动端图标记选择图标页面异常问题 const mobilePage=[//相关设置信息需要从serviceMetaInfo信息中获取,按照下面格式进行配置即可 {"mode":-2,"ext":{},"types":["pcx","mobile","func"],"hidden":"all","title":"图标","originUrl":"/entry/mobileapp/mobile/dialog/icon.w"}, {"mode":-2,"ext":{},"types":["pcx","mobile","func"],"hidden":"all","title":"选择图标","originUrl":"/entry/mobileapp/mobile/dialog/selectIcon.w"} ]; window.microService.menus.push(...mobilePage);
桌面端页面在移动端打开
应用资源管理中,已经有一个仅在桌面端显示的菜单
在应用资源管理中,再添加一个在移动端显示的菜单
- 类型:选择移动和功能
- 访问地址:输入桌面端路径格式的Url,例如:/react/pcxapp/pcx/share/pcxflow.w
- 模式:选择外部页面
配置后,保存并发布。如果配置了功能树菜单,打开“功能树配置”,添加菜单
桌面端页面运行效果
移动端运行的桌面端页面的效果
移动端页面在桌面端打开
应用资源管理中,已经有一个仅在移动端显示的菜单
在应用资源管理中,再添加一个在桌面端显示的菜单
- 类型:选择桌面和功能
- 访问地址:输入移动端路径格式的Url,例如:/react/mobileapp/mobile/share/mobileflow.w
- 模式:选择外部页面
配置后,保存并发布。如果配置了功能树菜单,打开“功能树配置”,添加菜单
移动端页面运行效果
桌面端运行的移动端页面的效果