安卓和ios调用vue中定义的方法

原创已于 2025-02-17 18:37:09 修改 · 718 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #javascript

于 2023-05-10 20:37:48 首次发布

iOS 同时被 3 个专栏收录

187 篇文章

订阅专栏

Android

14 篇文章

订阅专栏

Vue

6 篇文章

订阅专栏

文章讲述了如何在Vue.js应用中定义一个方法`helloWorld`，然后将其绑定到全局对象`window`上，以便于安卓和iOS的WebView或Webkit视图调用。在安卓端，通过`addJavascriptInterface`创建JavaScript接口；在iOS端，利用`evaluateJavaScript`执行JavaScript代码来调用这个方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在vue中定义需要在安卓和iOS应用中调用的方法：

methods: {
    helloWorld: function(name, mobile) {
    }
}

在vue中将方法绑定到全局对象(window)中：

mounted: function() {
    window.helloWorld = this.helloWorld;
}

在安卓和iOS应用中加载vue的WebView或Webkit视图，并启用JavaScript支持

在安卓和iOS应用中使用WebView或Webkit视图提供的JavaScript桥接机制

Android：

webView.addJavascriptInterface(new Object() {
  @JavascriptInterface
  public void helloWorld(String name, String mobile) {
    // 实现方法的代码
  }
}, "android");

iOS：

[webView evaluateJavaScript:@"window.helloWorld('张三', '18899999999');" completionHandler:nil];