0. 官方文档

官方文档https://docs.apicloud.com/Client-API/api#33

1. 方式一windows窗口

1.1 介绍

window是APICloud提供的最顶级的页面单位.一个APP至少会存在一个以上的window窗口,在用户打开APP应用，应用在初始化的时候，默认就会创建了一个name=root 的顶级window窗口，显示当前APP配置的首页。
新建window窗口。
注意: 如果之前已经存在同名的窗口,则APP不会再次创建新窗口,而是显示对应名称的窗口。

1.2 代码示例

 <li><img class="module4" @click="login" src="../static/images/image4.png"></li>methods:{login(){// 跳转到登录页面[通过新建窗口的方式跳转]// api.openWin({//     name: 'login',//     bounces: true,       // 窗口是否上下拉动//     reload: true,         // 如果页面已经在之前被打开了,是否要重新加载当前窗口中的页面//     url: './login.html',//     animation:{           // 打开新建窗口时的过渡动画效果【转场动画】//       type:"push",                //动画类型（详见动画类型常量）//      subType:"from_right",       //动画子类型（详见动画子类型常量）//        duration:400                //动画过渡时间，默认300毫秒//     },//     pageParam: {////     }// });}

1.3 关闭指定名称的窗口

如果当前APP中只有剩下一个顶级窗口root,则无法通过当前方法关闭! 也有部分手机直接退出APP了

//关闭当前window，使用默认动画
api.closeWin();//关闭指定window，若待关闭的window不在最上面，则无动画
api.closeWin({name: 'page1'
});

2. 方式二frame 帧页面

2.1 介绍

如果APP中所有的页面全部通过window窗口进行展开,则APP需要耗费大量的内存来维护这个窗口列表,从而导致, 用户操作APP时,APP响应缓慢甚至卡顿的现象.所以APP中除了通过新建窗口的方式展开页面以外, 还提供了帧的方式来展开页面.
帧,代表的就是一个窗口下开打的某个页面记录.所谓的帧就有点类似于浏览器中窗口通过地址栏新建的一个页面一样.
使用的时候注意:
1. APP每一个window窗口都可以打开1到多个帧.新建窗口的时候,系统会默认顺便创建第一帧出来.
2. 每一帧代表的都是一个html页面,
3. 默认情况下, APP的window的窗口会自动默认满屏展示.而帧可以设置矩形的宽高.如果顶层的帧页面没有满屏显示,则用户可以看到当前这一帧下的其他帧的内容.

2.2 代码示例

api.openFrame({name: 'page2',        // 帧页面的名称url: './page2.html',  // 帧页面打开的url地址data: '',             // 可选参数,如果填写了data,则不要使用url, data表示页面数据,可以是html代码bounces:false,        // 页面是否可以下拉拖动reload: true,         // 帧页面如果已经存在,是否重新刷新加载useWKWebView:true,historyGestureEnabled:true,animation:{type:"push",             //动画类型（详见动画类型常量）subType:"from_right",    //动画子类型（详见动画子类型常量）duration:300             //动画过渡时间，默认300毫秒},rect: {               // 当前帧的宽高范围// 方式1,设置矩形大小宽高x: 0,             // 左上角x轴坐标y: 0,             // 左上角y轴坐标w: 'auto',        // 当前帧页面的宽度, auto表示满屏h: 'auto'         // 当前帧页面的高度, auto表示满屏},pageParam: {          // 要传递新建帧页面的参数,在新页面可通过 api.pageParam.name 获取name: 'test'      // name只是举例, 可以传递任意自定义参数}
});

2.3 关闭帧页面

// 关闭当前 frame页面
api.closeFrame();// 关闭指定名称的frame页面
api.closeFrame({name: 'page2'
});

3. framegroup 帧页面组

3.1 介绍

framegroup实际上是基于frame操作的优化方案。
主要原因是，frame在每次打开页面的时候都需要加载页面数据，所以APICloud提供了帧页面组，允许我们在打开一个frame页面时可以预先加载其后续或相关的其他frame页面。

3.2 代码示例

api.openFrameGroup({name: 'group1',   // 组名rect: {           // 帧页面组的显示矩形范围// 方式1:x:,             //左上角x坐标，数字类型y:,             //左上角y坐标，数字类型w:,             //宽度，若传'auto'，页面从x位置开始自动充满父页面宽度，数字或固定值'auto'h:,             //高度，若传'auto'，页面从y位置开始自动充满父页面高度，数字或固定值'auto'// 方式2: marginLeft:,    //相对父页面左外边距的距离，数字类型marginTop:,     //相对父页面上外边距的距离，数字类型marginBottom:,  //相对父页面下外边距的距离，数字类型marginRight:    //相对父页面右外边距的距离，数字类型},frames: [{name:'',         //frame名字，字符串类型，不能为空字符串url:'',          // 页面地址useWKWebView:true,historyGestureEnabled:false,  //（可选项）是否可以通过手势来进行历史记录前进后退。pageParam:{},    // 页面参数bounces:true,    // 是否能下拉拖动}, {name:'',         //frame名字，字符串类型，不能为空字符串url:'',          // 页面地址useWKWebView:true,historyGestureEnabled:false,  //（可选项）是否可以通过手势来进行历史记录前进后退。pageParam:{},    // 页面参数bounces:true,    // 是否能下拉拖动},{...},...]
}, function(ret, err) {// 当前帧页面发生页面显示变化时,当前帧的索引.var index = ret.index;
});

3.3 关闭帧页面组

api.closeFrameGroup({name: 'group1' // 组名
});

3.4 切换当前帧页面组显示的帧页面

api.setFrameGroupIndex({name: 'group1', // 组名index: 2        // 索引,从0开始
});

APICloud进行窗口和页面操作相关推荐

jquery、js父子页面操作总结
jquery 父.子页面之间页面元素的获取,方法的调用 https://www.cnblogs.com/it-xcn/p/5896231.html 一.jquery 父.子页面之间页面元素的获取,方法 ...
内网穿透工具(永久免费、永不限速、开源)、一键启动、页面操作(支持window,mac)，自定义二级域名
java 内网穿透工具(net-penetrate).永久免费.永不限速.开源.一键启动.页面操作(支持window,mac),自定义二级域名介绍完全开源,免费使用,不会有人窃取你的信息(可看源码 ...
简单的在jsp页面操作mysql
简单的在jsp页面操作mysql ---恢复内容开始--- 上一篇讲了在DOS界面下操作mysql 现在我们来说说怎么在jsp页面中操作mysql 要用jsp页面操作mysql需要jdbc(不是非要j ...
web项目实现mysql增删改查并从前端页面操作
1.看下各个包下面的文件,我上一篇文章已经说过了,这里对上一章有一部分重复的 2.User.java是数据库元素写的一个类,代码如下 package com.hqyj.wj.model; //用户信息 ...
flask页面操作gpn接口
flask页面操作gpn接口 https://wizardforcel.gitbooks.io/flask-extension-docs/content http://cabeza.cn/blog/2 ...
一个html多个html文件怎么打开网页,Firefox如何单窗口多页面浏览
Firefox单窗口多页面浏览方法. ①按下" Ctrl + 鼠标左键"点击链接. ②使用鼠标中鍵点击链接. 简介火狐浏览器(Mozilla Firefox)是由Mozilla开 ...
开发环境 Minio 添加桶的操作流程-页面操作
命令操作 d开发环境 Minio 添加桶的操作流程_摇曳的精灵的博客-CSDN博客_minio创建桶页面操作
ajax json 渲染 html,jQuery+Ajax+js实现请求json格式数据并渲染到html页面操作示例
本文实例讲述了jquery+ajax+js实现请求json格式数据并渲染到html页面操作.分享给大家供大家参考,具体如下: 1.先给json格式的数据: [ {"id":1,&q ...
html 在框架里弹出页面,iframe弹出新窗口 iframe页面打开新窗口问题
如何使iframe中的链接都在新窗口打开 a.html文件源码如下如何让所有链接在新窗口打开2008-07-24 21:26 使用target="blank"属性 open 注意 ...

APICloud进行窗口和页面操作

0. 官方文档

1. 方式一windows窗口

1.1 介绍

1.2 代码示例

1.3 关闭指定名称的窗口

2. 方式二frame 帧页面

2.1 介绍

2.2 代码示例

2.3 关闭帧页面

3. framegroup 帧页面组

3.1 介绍

3.2 代码示例

3.3 关闭帧页面组

3.4 切换当前帧页面组显示的帧页面

APICloud进行窗口和页面操作相关推荐

最新文章

热门文章

APICloud进行窗口和页面操作

0. 官方文档

​​​​​​​1. 方式一windows窗口

1.1 介绍

1.2 代码示例

1.3 关闭指定名称的窗口

2. 方式二frame 帧页面

2.1 介绍

2.2 代码示例

2.3 关闭帧页面

3. framegroup 帧页面组

3.1 介绍

3.2 代码示例

3.3 关闭帧页面组

3.4 切换当前帧页面组显示的帧页面

APICloud进行窗口和页面操作相关推荐

最新文章

热门文章

1. 方式一windows窗口