混合开发之-vue和JsBridge跳转返回

这两天领导一直想说要做个混合开发，然后让我用vue和原生app联调，vue中几乎没什么难点，主要的是和原生app嵌套的跳转返回（目前就先遇到这个问题，我相信还有很多难题。。。），看了一天的文档也调试过都没成功，今天此刻终于成功了，很开心的分享下~

问题：原生app点击按钮可以跳到vue项目，但是返回不回去。。。复制代码

方法：

vue端：

  //在methods中加入这两个方法,其中closeWebview是和ios和android约定好的方法名
  methods:{
        backPage(e){//按钮的点击事件，实现关闭vue项目返回到原生页面中
            this.setupWebViewJavascriptBridge(function(bridge) {
                bridge.registerHandler("closeWebview",function(data,responseCallback){
                    responseCallback("button js callback");
                });
                var data = "hello";
                //下面这个是安卓调用的时候必须加，ios调用的时候没有也可以跳转和返回
                bridge.callHandler('closeWebview',data,function(resp){
                    //document.getElementById("show").innerHTML = "payInterface" + resp;
                });
            })
        },
        setupWebViewJavascriptBridge(callback) {
            if (window.WebViewJavascriptBridge) {
                callback(WebViewJavascriptBridge)
            } else {
                document.addEventListener('WebViewJavascriptBridgeReady', function() {
                    callback(WebViewJavascriptBridge)
                },false);
            }
            //iOS使用
            if (window.WebViewJavascriptBridge) { return callback(WebViewJavascriptBridge); }
            if (window.WVJBCallbacks) { return window.WVJBCallbacks.push(callback); }
            window.WVJBCallbacks = [callback];
            var WVJBIframe = document.createElement('iframe');
            WVJBIframe.style.display = 'none';
            WVJBIframe.src = 'wvjbscheme://__BRIDGE_LOADED__';
            document.documentElement.appendChild(WVJBIframe);
            setTimeout(function() { document.documentElement.removeChild(WVJBIframe) }, 0)
        }
    }
复制代码

具体可以参考：https://www.jianshu.com/p/e37ccf32cb5b