APP跳转外部链接并数据通信

凯特-肖海杰

一、案例效果                          APP外部链接跳转到自定义的页面，外部地址需要头部引入mui的js代码                   二、实现思路           例子：表单中的按钮事件触发弹出个外部链接            1. 点击表单中按钮的自定义功能脚本事件，执行跳转b页面并携带参数        2. b页面获得到参数进行业务逻辑处理；        3. b页面处理完业务逻辑派发事件到表单中的监听方法；        4. 表单监听方法接收到b页面派发的事件处理业务逻辑； 三、操作步骤 1. 表单页面跳转b页面携带参数，在功能脚本中添加该方法；                <font color="#696969"> JE.openWindow({         url: 'http://baidu.com', //跳转b页面的地址         id: 'openWindow_baidu', // 绑定跳转的b的面板id，表单通过该id进行数据传输         extras: { // 自定义跳转到b页面需要携带的参数             fnName: 'tabFn',  // b页面根据业务逻辑，通过调用tabFn事件名通知表单并携带数据             a_Id: plus.webview.currentWebview().id, // 表单页面的id，b页面拿到该id才能和表单传输数据         }     });     function dochange(e) {         console.log('外部链接事件传递的参数', e);         alert('成功监听到外部链接传递的事件');         // 拿到b页面中的e，执行业务中的代码         // 处理完业务后删除掉该事件         window.removeEventListener('tabFn', dochange);     }     // 监听b页面传递过来的数据处理业务逻辑     window.addEventListener('tabFn', dochange);</font> 复制代码 2. b页面获得到参数进行业务逻辑处理 const b_webview = plus.webview.currentWebview(); // 获取表单页面跳转过来的传递的参数，当前b页面面板     const a_id = b_webview.a_Id; // 表单页面的面板id；     const a_fnName = b_webview.fnName; // 表单页面的监听事件名称 复制代码 3. b页面处理完业务逻辑派发事件到表单页面   const a_webview = plus.webview.getWebviewById(a_id); // 根据当前b面板的id获取到表单面板     const datas = {test: 'b页面的测试数据'}     mui.fire(a_webview, a_fnName, {datas}); // 向表单页面派发事件，触发表单页面的监听 复制代码 4.表单接收到b页面派发的事件处理业务逻辑 已经在第一步注册过该事件,拿到b页面的数据就可处理对应的业务逻辑 function dochange(e) {         console.log('外部链接事件传递的参数', e);         alert('成功监听到外部链接传递的事件');         // 拿到b页面中的e，执行业务中的代码         // 处理完业务后删除掉该事件         window.removeEventListener('tabFn', dochange);     }     // 监听b页面传递过来的数据处理业务逻辑     window.addEventListener('tabFn', dochange); 复制代码 四、相关代码 /**      * 表单页面跳转到b页面 ---> 当前是表单页面的代码      */     JE.openWindow({         url: 'http://baidu.com', //跳转b页面的地址         id: 'openWindow_baidu', // 绑定跳转的b的面板id，表单通过该id进行数据传输         extras: { // 自定义跳转到b页面需要携带的参数             fnName: 'tabFn',  // b页面根据业务逻辑，通过调用tabFn事件名通知表单并携带数据             a_Id: plus.webview.currentWebview().id, // 表单页面的id，b页面拿到该id才能和表单传输数据         }     });     function dochange(e) {         console.log('外部链接事件传递的参数', e);         alert('成功监听到外部链接传递的事件');         // 拿到b页面中的e，执行业务中的代码         // 处理完业务后删除掉该事件         window.removeEventListener('tabFn', dochange);     }     // 监听b页面传递过来的数据处理业务逻辑     window.addEventListener('tabFn', dochange);     /**      * b页面完成业务逻辑后触发表单页面      */     const b_webview = plus.webview.currentWebview(); // 获取表单页面跳转过来的传递的参数，当前b页面面板     const a_id = b_webview.a_Id; // 表单页面的面板id；     const a_fnName = b_webview.fnName; // 表单页面的监听事件名称     const a_webview = plus.webview.getWebviewById(a_id); // 根据当前表单面板的id获取到表单面板     const datas = {test: 'b页面的测试数据'}     mui.fire(a_webview, a_fnName, {datas}); // 向表单页面派发事件，触发表单页面的监听 复制代码 五、关键字，相关问题                          数据通信           外部链接           跳转           打开新页面