Playground 上的 VUE 完整解决方案.
我正在使用 NativeScript Vue 创建一个应用程序，并使用 webview 作为主要组件。在加载的网站中，有一个文件输入字段用于捕获相机输入。
它在 iOS 设备上运行良好，但在 Android 上，输入字段不起作用。
有谁知道让文件输入字段在 Android webview 上工作的解决方案吗？
我使用的tns-android版本:6.1.1
更新 1
我使用哪个平台？
- Android
- 10.0
- 模拟器。像素3a
有关堆栈的更多信息:
- CLI:6.1.2
- nodejs:v10.16.0
- tns 核心模块:[email protected]
运行时:
"tns-android": { "version": "6.1.1" }, "tns-ios": { "version": "6.1.0" }
插件:
"dependencies": {
"@nota/nativescript-webview-ext": "^5.4.1", "@nstudio/nativescript-camera-plus": "^2.2.6", "axios": "^0.19.0", "js-cookie": "^2.2.1", "nativescript-camera": "^4.5.0", "nativescript-geolocation": "^5.1.0", "nativescript-plugin-firebase": "^9.1.1", "nativescript-theme-core": "^1.0.6", "nativescript-ui-sidedrawer": "^7.0.2", "nativescript-vue": "~2.4.0", "net": "^1.0.2", "rxjs": "^6.5.3", "tns-core-modules": "~6.1.0", "vuex": "^3.1.1"},
"devDependencies": {
"@babel/core": "~7.1.0", "@babel/preset-env": "~7.1.0", "babel-loader": "~8.0.0", "nativescript-dev-webpack": "~1.2.0", "nativescript-vue-template-compiler": "~2.4.0", "node-sass": "^4.7.1", "vue-loader": "~15.4.0"},
在我的 Vue 文件(加载 webview 的位置)中，我像这样加载网站:
<webview @loaded="onWebViewLoaded" :src="webViewSrc"
:builtInZoomControls="false"
:displayZoomControls="false"
:debugMode="true"
/>
然后在 onWebViewLoaded 中我尝试这样做: 让 myWebChromeClientClass = androidVm.webkit.WebChromeClient.extend({
onShowFileChooser: function (WebView, ValueCallback, FileChooserParams) {
// FileChooserParams.createIntent()
camera.takePicture() // Using nativescript-camera
.then(function (imageAsset) {
console.log("Result is an image asset instance");
var image = new Image();
image.src = imageAsset;
console.log(image)
}).catch(function (err) {
console.log("Error -> " + err.message);
});
return false
}
});
let myWebChromeClient = new myWebChromeClientClass();
webView.android.setWebChromeClient(myWebChromeClient);
目前，我正在努力使 native 脚本相机在拍照后表现良好(总是返回“取消”)，但我知道有一种方法可以使用 FileChooserParams 显示 native 文件输入选择，但我无法做到这一点工作要么是我在网上找到的最接近的解决方案是针对 Java 的，但不太确定如何将其转换为 Javascript/Vue。
还有更多想法吗？
最佳答案
您必须扩展 android.webkit.WebChromeClient 并在 nativeView 上分配相同的内容。
您必须实现onShowFileChooser方法，使用 Intent 或其他方法处理文件的选择。
关于android - 使文件输入字段在 Android nativescript vue webview 上工作，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/58175694/