From 487719b3188aaafcca49104b4ce62035dc29e953 Mon Sep 17 00:00:00 2001 From: Tevin <tingquanren@163.com> Date: Wed, 21 Apr 2021 15:45:38 +0800 Subject: [PATCH] 实现表单日期时间选择组件 --- common/Bridge.js | 103 +++++++++++++++++++++++++-------------------------- 1 files changed, 50 insertions(+), 53 deletions(-) diff --git a/common/Bridge.js b/common/Bridge.js index f1cec46..d5cdfc2 100644 --- a/common/Bridge.js +++ b/common/Bridge.js @@ -2,26 +2,25 @@ * 跨端双向通讯桥 * @author Tevin * @tutorial - * 网页对 app 发起通讯 - * 1. app 注册接收机制 - * app 在网页打开之前,注入方法 linking - * 2. js 发起 - * bridge.invoking('methodName', {key1:'value1'}, function(res){console.log(res)}); - * 3. Bridge 转换为发送 + * 网页对 App 发起通讯 + * 1. 【App端】App 注册接收器,用于接收网页通知 + * 在页面打开之前,App 注入方法 linking = function(paramStr) { <Native Code> } + * 2. 网页业务中 js 发起通讯 + * $bridge.invoking('methodName', {key1:'value1'}, function(res) {console.log(res)}); + * 3. 由 Bridge 转换为调用注入的方法(含callback) * window.linking('{method:\'methodName\', param:{key1:\'value1\'}, callback:\'bridge.cb111at1541994536008\'}'); - * 4. app 处理完后直接调用网页上的回调,并传递结果 + * 4. 【App端】App 处理完后直接调用网页上的全局回调,并传递结果完成通讯 * bridge.cb101at1541994536008('{key2:\'value2\'}'); - * app 对网页发起通讯 - * 1. 网页注册接收器,用于接收 app - * window.telling = function(dataStr) {}; - * 2. 网页注册业务 - * bridge.register('methodName', function(data, callback){}); - * 3. app 调用(至少需要在页面完成再延迟至少1秒之后) + * App 对网页发起通讯 + * 1. 网页注册接收器,用于接收 App 通知 + * window.telling = function(dataStr) { someJs }; + * 2. 网页业务中注册接收通讯 + * $bridge.register('methodName', function(res, callback) {}); + * 3. 【App端】App 调用网页中的全局方法(至少需要在页面完成并延迟至少1秒之后再调用) * telling('{method:\'methodName\', param:{key1:\'value1\'}, marker:\'mk222at1541994536008\'}'); - * 4. 网页完成业务逻辑处理,并回调 + * 4. 网页完成业务逻辑处理后调用注入的方法,并传递结果完成通讯(含marker、不含callback) * window.linking('{method:\'methodName\', param:{key2:\'value2\'}, marker:\'mk222at1541994536008\'}'); */ - export class Bridge { @@ -30,7 +29,10 @@ count: 100, }; this._receives = {}; + this._earlyInvok = []; this._init(); + // 挂载到全局 + window.bridge = this; } /** @@ -40,7 +42,7 @@ */ _checkLinking() { // 安卓注入 - if (window.iTop && window.iTop.linking) { + if (window.linking) { return 'android'; } // 没有注入 @@ -59,25 +61,17 @@ setTimeout(() => { this._init(++count); }, 500); - } else { - this._initReceive(); } - } - - /** - * 发送 - * @param {object} data - * @private - */ - _send(data) { - const platform = this._checkLinking(); - // 安卓注入 - if (platform === 'android') { - window.iTop.linking(JSON.stringify(data)); - } - // 没有注入 + // 开始工作 else { - console.error('没有注入 linking 方法!'); + this._initReceive(); + // 补发 + if (this._earlyInvok.length > 0) { + this._earlyInvok.forEach(invok => { + const { method, param, callback } = invok; + this._sendLinking(method, param, callback); + }); + } } } @@ -108,11 +102,11 @@ delete this[name]; }; // 发送 - this._send({ + window.linking(JSON.stringify({ method, param, callback: 'bridge.' + name, - }); + })); } /** @@ -122,17 +116,21 @@ * @param {function} [callback] */ invoking(method, param, callback) { + // param 为函数时 const trans = param; - if (trans) { - if (Object.prototype.toString.call(trans) === '[object Function]') { - callback = trans; - param = {}; - } + if (trans && Object.prototype.toString.call(trans) === '[object Function]') { + callback = trans; + param = {}; } else { callback = null; - param = {}; } - this._sendLinking(method, param, callback); + if (this._checkLinking()) { + this._sendLinking(method, param, callback); + } + // 尚未准备好,挂起 + else { + this._earlyInvok.push({ method, param, callback }); + } } /** @@ -140,18 +138,17 @@ * @private */ _initReceive() { - if (!this._checkLinking()) { - return; - } window.telling = (res) => { const data = typeof res === 'string' ? JSON.parse(res) : res; - const method = data.method; - const param = data.param; - const marker = data.marker; + const { method, param, marker } = data; if (this._receives[method]) { - this._receives[method](param, (param2) => { - this._sendTelling(method, param2, marker); - }); + if (marker) { + this._receives[method](param, (param2) => { + this._sendTelling(method, param2, marker); + }); + } else { + this._receives[method](param); + } } }; } @@ -170,11 +167,11 @@ return; } // 发送 - this._send({ + window.linking(JSON.stringify({ method, param, marker, - }); + })); } /** -- Gitblit v1.9.1