zoukankan      html  css  js  c++  java
  • vue 调用 ios提供的方法

    各种百度之后,在别的站看到一篇文章,介绍可以使用 WebViewJavascriptBridge与原生app进行通信;

    在项目中尝试了一下,确实有效记录一下。

    原文链接:

    https://blog.csdn.net/szjSmiling/article/details/82773293

    1,引入第三方WebViewJavascriptBridge的库

     1     function setupWebViewJavascriptBridge(callback) {
     2       if (window.WebViewJavascriptBridge) {
     3         return callback(window.WebViewJavascriptBridge)
     4       }
     5       if (window.WVJBCallbacks) {
     6         return window.WVJBCallbacks.push(callback)
     7       }
     8       window.WVJBCallbacks = [callback]
     9       let WVJBIframe = document.createElement('iframe');
    10       WVJBIframe.style.display = 'none'
    11       WVJBIframe.src = 'https://__bridge_loaded__'
    12       document.documentElement.appendChild(WVJBIframe);
    13       setTimeout(() => {
    14         document.documentElement.removeChild(WVJBIframe)
    15       }, 0)
    16     }
    17     export default {
    18       callhandler(name, data, callback) {
    19         setupWebViewJavascriptBridge(function (bridge) {
    20           bridge.callHandler(name, data, callback)
    21         })
    22       },
    23       registerhandler(name, callback) {
    24         setupWebViewJavascriptBridge(function (bridge) {
    25           bridge.registerHandler(name, function (data, responseCallback) {
    26             callback(data, responseCallback)
    27           })
    28         })
    29       }
    30     }

    新建一个js文件,把上面的代码复制粘贴就好了

    2,在main.js中引入文件

    import Bridge from './assets/js/bridge.js'
    
    Vue.prototype.$bridge = Bridge

    3,调用方法

    let ua = navigator.userAgent;
                let isAndroid = ua.indexOf('Android') > -1 || ua.indexOf('Adr') > -1;
                let isiOS = !!ua.match(/(i[^;]+;( U;)? CPU.+Mac OS X/);
                // console.log(isAndroid, '安卓')
                // console.log(isiOS, 'ios')
                if (isiOS) {
    
                    this.$bridge.callhandler('popToStudyRootVC', (data) => {
                        // 处理返回数据
                        console.log(data, '我走了这里')
                    })
                }
    popToStudyRootVC:是有原生开发的同事定义的方法名

    这样就完成了

  • 相关阅读:
    redis、memcache、mongoDB有哪些区别(转载)
    初识spring与quartz整合实现定时任务
    使用CXF与Spring集成实现RESTFul WebService
    Linux top
    JS操作Radio与Select
    初识Redis
    JVM基础学习
    自动装配【Spring autowire】
    包含中文的字符串中截取前N个字符
    EF中Json序列化对象时检测到循环引用的解决办法
  • 原文地址:https://www.cnblogs.com/yutianA/p/11200768.html
Copyright © 2011-2022 走看看