HarmonyOS 鸿蒙Next调用onShowFileSelector如何获取H5侧input方法中参数类型，类似Android的FileChooserParams的acceptTypes

HarmonyOS 鸿蒙Next调用onShowFileSelector如何获取H5侧input方法中参数类型，类似Android的FileChooserParams的acceptTypes 目前H5侧有需求需要调用鸿蒙侧web的onShowFileSelector的方法，但是需要判断input传递的类型。目前api没有对应类型。

2 回复

// xxx.ets import web_webview from ‘@ohos.web.webview’; import picker from ‘@ohos.file.picker’; import { BusinessError } from ‘@ohos.base’; import { promptAction } from ‘@kit.ArkUI’; import { photoAccessHelper } from ‘@kit.MediaLibraryKit’;

@Entry @Component struct Index { controller: web_webview.WebviewController = new web_webview.WebviewController() dialogController: CustomDialogController = new CustomDialogController({ builder: ShowDialog({}) }) @Provide event: OnShowFileSelectorEvent | undefined = undefined

build() { Column() { Web({ src: $rawfile(‘index.html’), controller: this.controller }) .onShowFileSelector((event) => { this.dialogController.open() this.event=event return true }) } } }

@CustomDialog struct ShowDialog { @Consume event: CustomEvent @State choice: string = ‘’ controller: CustomDialogController = new CustomDialogController({ builder: ShowDialog({}) })

async handle(param: CustomEvent) { if (this.choice === ‘文件’) { console.log(当前的选择是2${this.choice}) console.log(‘MyFileUploader onShowFileSelector invoked’) let photoSelectOptions = new photoAccessHelper.PhotoSelectOptions(); let photoPicker = new photoAccessHelper.PhotoViewPicker(); // 过滤选择媒体文件类型为IMAGE photoSelectOptions.MIMEType = photoAccessHelper.PhotoViewMIMETypes.IMAGE_VIDEO_TYPE; // 设置最大选择数量 photoSelectOptions.maxSelectNumber = 5; let chooseFile: picker.PhotoSelectResult = await photoPicker.select(photoSelectOptions); // 获取选择的文件列表 param.result.handleFileList(chooseFile.photoUris); } else if (this.choice === ‘相机’) { promptAction.showToast({ message: ‘正在开发中’ }) } }

build() { Column({ space: 10 }) { Button(‘文件’) .onClick(() => { this.choice = ‘文件’ this.handle(this.event) this.controller.close() }) Button(‘相机’) .onClick(() => { this.choice = ‘相机’ this.handle(this.event) this.controller.close() }) }.width(“100%”) .height(400) .justifyContent(FlexAlign.Center) } }

interface CustomEvent { result: FileSelectorResult, fileSelector: FileSelectorParam }

// index.html

<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8"> </head> <body> <form id="upload-form" enctype="multipart/form-data"> <input type="file" id="upload" name="upload"/> </form> </body> </html> ```

更多关于HarmonyOS 鸿蒙Next调用onShowFileSelector如何获取H5侧input方法中参数类型，类似Android的FileChooserParams的acceptTypes的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙系统中，当调用onShowFileSelector方法时，如果你希望获取H5侧input方法中参数类型，类似于Android的FileChooserParams的acceptTypes，可以通过以下方式实现：

鸿蒙系统的onShowFileSelector回调通常会包含一个用于传递选择文件相关信息的参数对象。这个对象可能包含文件类型过滤器等信息。要获取这些类型信息，你需要检查传递给onShowFileSelector的参数对象。

假设你正在使用一个自定义组件或系统提供的API来监听文件选择器事件，你可以这样处理：

  1. 检查回调参数：首先，查看onShowFileSelector方法的回调参数，通常这个参数会包含文件选择的相关配置，包括接受的文件类型。

  2. 提取文件类型：从回调参数中提取acceptTypes或其他类似字段，这些字段通常是一个字符串数组，表示允许选择的文件类型（如["image/*", "video/*"]）。

  3. 使用提取的类型：根据提取的文件类型，你可以在应用逻辑中做相应的处理，比如过滤文件列表，只显示符合类型的文件。

如果onShowFileSelector回调参数中没有直接提供acceptTypes字段，你可能需要检查鸿蒙系统的文档或API说明，了解如何通过其他方式获取这些信息。

如果问题依旧没法解决请联系官网客服,官网地址是 https://www.itying.com/category-93-b0.html

回到顶部