bridge.registerHandler调用不生效

JsBridge地址
JsBridge

bridge.registerHandler调用不生效,需要先bridge.init,再使用bridge.registerHandler

在app.vue文件夹里

 mounted() {
    this.registerGobackHandler();
  },

在methods里

  // 注册 goback 处理器
    registerGobackHandler() {
      // JS注册事件监听
      function connectWebViewJavascriptBridge(callback) {
        if (window.WebViewJavascriptBridge) {
          callback(WebViewJavascriptBridge);
        } else {
          document.addEventListener(
            "WebViewJavascriptBridgeReady",
            function() {
              callback(WebViewJavascriptBridge);
            },
            false
          );
        }
      }

      // 注册回调函数,第一次连接时调用 初始化函数
      connectWebViewJavascriptBridge(bridge => {
        bridge.init(function(message) {
          console.log("JS got a message", message);
          var data = {
            "Javascript Responds": "测试中文!",
          };
          console.log("JS responding with", data);
        });
        bridge.registerHandler("goback", function(data, responseCallback) {
          if (this.$route.name !== "home" && this.$route.name !== "login") {
            this.$router.go(-1);
          }
          responseCallback(data);
        });
      });
    },

结果报错,this.$route是undifined,再打印this,this是undifined,发现是因为箭头函数的this会去箭头的外层找,但是bridge.registerHandler不是使用的箭头函数,所以是没定义,把bridge.registerHandler也改为箭头函数,就可以

 // 注册回调函数,第一次连接时调用 初始化函数
      connectWebViewJavascriptBridge(bridge => {
        bridge.init(function(message) {
          console.log("JS got a message", message);
          var data = {
            "Javascript Responds": "测试中文!",
          };
          console.log("JS responding with", data);
        });
        bridge.registerHandler("goback", (data, responseCallback) => {
          console.log("JS Echo called with:", data);
           if (this.$route.name !== "home" && this.$route.name !== "login") {
            this.$router.go(-1);
          }
          responseCallback(data);
        });
      });

你可能感兴趣的:(javascript,前端)