Android与Vue的交互的方法示例
2018-05-28 08:22
537 查看
做过 Android 混合开发的,应该都知道 Android 中 Java 代码和 Javascript 代码之间的交互怎么做。
首先回顾一下 Java 和 Javascript 之间的交互。
JavaScript 调用 Java
Android 中 WebView 添加供 Html 页面调用的 Java 方法:
mWebView.addJavascriptInterface(new DirectToJS(), "AndroidObj"); class DirectToJS{ @JavascriptInterface public void showToast(){ Toast.makeText(this, "Android Toast",Toast.LENGTH_SHORT).show(); } }
Html 页面中 JavaScript 调用 Java 方法的方式如下:
window.AndroidObj.showToast();
JavaScript 代码中: window 是网页的 Window 实体,这个做前端开发的人都非常熟悉; AndroidObj 是 Android 端给 WebView 提供的一个实体,Android 会将这个实体赋给 WebView 的 window; showToast() 就是 Java 提供给 Html 的方法。
Java 调用 JavaScript
首先 Html 上写个普通的 JavaScript 方法:
function showAlert(){ alert("Html Alert"); }
Android 中只要执行以下代码即可:
mWebView.loadUrl("javascript:showAlert()");
Vue 框架上的坑
如果前端用的是 Vue 框架,那么如果你在 js 脚本上直接写一个方法,Android 是调用不到的,无论是写在那个位置。
这是因为 Vue 框架中,脚本上的方法不是属于 window 的方法,你应该将要提供给 Android 调用的方法赋给 window,这样,Android 中才能调得到:
window['showAlert'] = { alert("Html Alert"); }
总得来说,对于普通的网页,写在 js 脚本上的方法,默认都是属于 window 实体的;而 Vue 框架中,由于框架内部的实现机制比较特殊,你写在 js 脚本上的方法,不是真正页面上的方法,所以在 Android 中是调用不到的。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- Android在网络中与JavaWeb的项目进行交互的方法
- Android WakeLock使用方法示例代码
- 【android】HttpURLConnection 几种不同方法示例【一】
- 【android】HttpURLConnection 几种不同方法示例【二】
- Android回调方法示例
- 【android】HttpURLConnection 几种不同方法示例【三】
- 【android】HttpURLConnection 几种不同方法示例【中】
- 基于Android中手势交互的实现方法
- Android与Javascript交互示例(三)
- Android中程序与Service交互的方式——交互方式(五种方法)
- Android与Javascript交互示例(一)
- Android与Javascript交互示例(一)
- Android与Javascript交互示例(一)
- Linux下Java 通过JNI native与C进行交互的方法实现示例
- Flex与后台交互的4种方法 URLLoader、HTTPService、WebService、RemoteObject使用示例
- Android与Javascript交互示例(二)
- android 关于view 中 getTag()和setTag()方法使用示例
- Android中UI线程与后台线程交互设计的方法
- Android中的onCreateOptionsMenu()方法和onOptionsItemSelected()方法示例
- android webView js方法和java 方法交互