【quickhybrid】架构一个Hybrid框架（三）

【上一篇】

 

应用示例：

 

打开新页面 -》page模块-》open方法

HTML：

 

指南解读

 

JS执行API:' + id);

    //callbackId:病例集',

        // 额外数据  是对于方法传递的额外参数，原生容器会解析成JSONObject

        data: {



        },

        success: function(result) {

            //所有的API调用错误都会走失败回调

            console.log(error);

            showTips('失败:' + JSON.stringify(error));

        }

    });

};

 

大致流程：H5页面：JS调起对应的API，与Native通信，API实现JSBridge的通信，在对应环境的API中可以添加模块和方法。打开新页面，最简单的方式就是quick.page.open(‘http://www.baidu.com？..’)，但是总要有调起API的行为。

打开新页面 -》page模块-》openLocal方法 

对于quick.page.openLocal():打开应用内的原生页面，

写法详见：https://quickhybrid.github.io/quickhybrid-doc/api/api_page/api_page.html

 

打开应用内原生页面

// 示例页面不一定可以打开，仅供参考
var className = quick.os.android ? 'com.epoint.demo.view.ComponentCaseActivity' : 'EPTFileSelectViewController';

quick.page.openLocal({
    className: className,
    isOpenExist: 0,
    data: {
        key1: 'value1'
    },
    success: function(result) {
        /**
         * 目标页面关闭后会触发这个回调
         * 参数需要原生页面主动设置result才能正常返回
         * {
                resultData: '可能是json，也可能是普通字符串，要看怎么传参的'
           }
         */

    },
    error: function(error) {}
});

  

 

对于quick.navigator.setTitle方法，可以仿照上述调起API，也可以在script标签中直接写quick.navigator.setTitle（‘我的知识库’），这样当页面加载的时候就会自动控制标题为‘我的知识库’，而不用点击触发quick中的API。

   对于quick.page.close方法，，有很多种传参的方式，本次开发使用的是兼容传参，即quick.page.close（‘value’）。

 

其他API调用案例详情，请参考-》手册 -》API

 

正事说完了，在这里宣传一下朋友的店铺：一个新开的汉服的店铺，满足小时候披床单的愿望，男女都有哟。。。

店铺名称：汉衿凤韵，点击进店铺，欢迎选购哟，说明了解来源可以优惠！！！

 

 

 

 

 

 

 

 

 

 

文档链接：https://quickhybrid.github.io/quickhybrid-doc/

github上的源码：Android版   IOS版

【下一篇】