uni-app web-view组件加载HTML页面时,表单上传组件文件属性accept=".xls,.xlsx,.doc,.docx,.pdf"仅打开相机选项,预期结果不正确

uni-app web-view组件加载HTML页面时,表单上传组件文件属性accept=".xls,.xlsx,.doc,.docx,.pdf"仅打开相机选项,预期结果不正确

信息类别 详细信息
产品分类 uniapp/App
PC开发环境操作系统 Windows
PC开发环境操作系统版本号 Win10
HBuilderX类型 正式
HBuilderX版本号 4.08
手机系统 Android
手机系统版本号 Android 13
手机厂商 realme
手机机型 X2
页面类型 vue
vue版本 vue2
打包方式 云端
项目创建方式 HBuilderX

操作步骤:

<input "file" name="file" accept=".xls,.xlsx,.doc,,docx,.pdf" class="el-upload_ input">

预期结果:

应该出现文件管理器,可以选择对应类型的文件

实际结果:

只能选择相机设置

bug描述:

web-view组件,加载的HTML页面时,表单上传组件文件属性accept=“.xls,.xlsx,.doc,.docx,.pdf”,打开的只有相机选项,如下图所示

image image


更多关于uni-app web-view组件加载HTML页面时,表单上传组件文件属性accept=".xls,.xlsx,.doc,.docx,.pdf"仅打开相机选项,预期结果不正确的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于uni-app web-view组件加载HTML页面时,表单上传组件文件属性accept=".xls,.xlsx,.doc,.docx,.pdf"仅打开相机选项,预期结果不正确的实战教程也可以访问 https://www.itying.com/category-93-b0.html


uni-app 中使用 web-view 组件加载 HTML 页面时,如果表单上传组件的 accept 属性设置为 ".xls,.xlsx,.doc,.docx,.pdf",但仅打开相机选项,这可能是由于 web-view 组件的某些限制或浏览器行为导致的。

可能的原因和解决方案:

  1. 浏览器行为差异

    • 不同的浏览器对 accept 属性的支持可能不同。某些移动端浏览器可能会将 accept 属性解释为允许用户选择某些类型的文件(如图片、视频、音频等),而不是直接打开文件管理器。
    • 你可以尝试在 PC 端浏览器中测试,看看是否能够正常打开文件管理器。
  2. web-view 组件的限制

    • web-view 组件本质上是一个嵌入的浏览器视图,可能在某些平台上对表单上传的支持不完全。
    • 你可以尝试在 web-view 中直接使用 <input type="file"> 元素,而不是通过 accept 属性来限制文件类型。
  3. 文件类型限制

    • 确保 accept 属性的值是正确的,并且没有多余的空格或其他字符。例如:accept=".xls,.xlsx,.doc,.docx,.pdf"
  4. 使用 uni.chooseFile

    • 如果 web-view 中的表单上传行为不符合预期,你可以尝试使用 uni-app 提供的 uni.chooseFile API 来实现文件选择功能。这样可以更好地控制文件选择的行为。

    示例代码:

    uni.chooseFile({
      count: 1, // 选择文件的数量
      type: 'all', // 文件类型,可以是 'image', 'video', 'all'
      success: (res) => {
        console.log(res.tempFilePaths); // 选择的文件路径
      },
      fail: (err) => {
        console.error(err);
      }
    });
回到顶部