应无所住,而生其心
排名
1
文章
870
粉丝
112
评论
163
net core webapi post传递参数
庸人 : 确实坑哈,我也是下班好了好几次,发现后台传递对象是可以的,但...
百度编辑器自定义模板
庸人 : 我建议换个编辑器,因为现在百度富文本已经停止维护了,用tinymec...
ICP备案 :渝ICP备18016597号-1
网站信息:2018-2025TNBLOG.NET
技术交流:群号656732739
联系我们:contact@tnblog.net
公网安备:50010702506256
欢迎加群交流技术

uniapp中webview跳转到app内部页面

8501人阅读 2020/10/23 17:06 总访问:5407220 评论:0 收藏:0 手机
分类: 移动开发

官方文档:

https://ask.dcloud.net.cn/article/35083


第一步:在webview加载的页面引入Js

  1. <!-- uni 的 SDK,必须引用。 -->
  2. <script type="text/javascript" src="https://js.cdn.aliyun.dcloud.net.cn/dev/uni-app/uni.webview.1.5.2.js"></script>

还有一个微信小程序的,如果不考虑微信小程序,则无需引入微信的 JS-SDK。


第二步:注意调用时机
在引用依赖的文件后,需要在 HTML 中监听 UniAppJSBridgeReady 事件触发后,才能安全调用 uni 的 API。

  1. document.addEventListener('UniAppJSBridgeReady'function({  
  2.     uni.getEnv(function(res{  
  3.         console.log('当前环境:' + JSON.stringify(res));  
  4.     });  
  5. });


第三步:实际调用

支持调用所有的 uni 路由方法,可以实现从 HTML 重新跳转回应用内的页面。

在 UniAppJSBridgeReady 后,调用路由方法跳转到应用内的页面。


官方例子:

  1. document.addEventListener('UniAppJSBridgeReady'function({  
  2.     document.querySelector('.btn-list').addEventListener('click'function(evt{  
  3.         var target = evt.target;  
  4.         if (target.tagName === 'BUTTON') {  
  5.             var action = target.getAttribute('data-action');  
  6.             if(action === 'navigateTo') {  
  7.                 uni.navigateTo({  
  8.                     url'/pages/component/button/button'  
  9.                 });  
  10.             }  
  11.         }  
  12.     });  
  13. });

自己使用,需要传参:

  1. //uniappwebview跳转到app内部页面
  2. document.addEventListener('UniAppJSBridgeReady'function ({
  3.     document.querySelector('.jump-uniapp').addEventListener('click'function (evt{
  4.         var target = evt.target;
  5.         var articleId = target.getAttribute('articleId');
  6.         var userName = target.getAttribute('userName');
  7.         //if (target.tagName === 'BUTTON') {
  8.             //var action = target.getAttribute('data-action');
  9.             //if (action === 'navigateTo') {
  10.                 uni.navigateTo({
  11.                     url'/pages/details/articleDetailWebView?id=' + articleId + "&userName=" + userName
  12.                 });
  13.             //}
  14.         //}
  15.     });
  16. });

参数就用自定义属于绑定好即可,然后使用target.getAttribute('xx')这种方式获取即可。一次成功!

欢迎加群讨论技术,1群:677373950(满了,可以加,但通过不了),2群:656732739。有需要软件开发,或者学习软件技术的朋友可以和我联系~(Q:815170684)

评价

Murphy

2019/10/7 11:05:06

过滤这个东西用起来确实还可以

剑轩:@Murphy嗯嗯,相当于增加一个方法可以自己增加一些逻辑

2019/10/7 13:25:12 回复