jdf2e / nutui-react

京东风格的移动端 React 组件库 、支持多端小程序(A React UI Toolkit for Mobile Web)
https://nutui.jd.com/react/
913 stars 260 forks source link

Uploader 无法过滤 webp 文件类型的上传 #2521

Open 160905 opened 3 months ago

160905 commented 3 months ago

NutUI React 包名

@nutui/nutui-react

NutUI React 版本号

^2.3.10

平台

weapp

重现链接

https://github.com/160905/nutui-bug

重现步骤

  1. 设置 accept属性 jpeg,.jpg
  2. 上传文件时还会允许选择 webp 图片

期望的结果是什么?

不允许用户上传 webp 格式的图片,同时希望增加图片上传前的验证拦截不发送 post request。 上传成功后希望是能有个配置可以将上传成功后的文件地址同步到 form 表单。 带有编辑功能的页面回显图片时,希望只设置一个文件地址。

实际的结果是什么?

当选择 webp 文件后依然会触发onSucess,但是 responseText 里已经返回了不支持该文件类型的 code,这时也无法使用code去删除这个 preview 文件。交互效果奇怪。 而且上传成功后,右上角的 close icon 在 图片 mask 层下方比较奇怪。

环境信息

Taro v3.6.30

Taro CLI 3.6.30 environment info: System: OS: macOS 13.3.1 Shell: 5.9 - /bin/zsh Binaries: Node: 16.20.2 - ~/.nvm/versions/node/v16.20.2/bin/node Yarn: 1.22.19 - ~/.nvm/versions/node/v16.20.2/bin/yarn npm: 8.19.4 - ~/.nvm/versions/node/v16.20.2/bin/npm npmPackages: @tarojs/cli: 3.6.30 => 3.6.30 @tarojs/components: 3.6.30 => 3.6.30 @tarojs/helper: 3.6.30 => 3.6.30 @tarojs/plugin-framework-react: 3.6.30 => 3.6.30 @tarojs/plugin-html: 3.6.30 => 3.6.30 @tarojs/plugin-platform-alipay: 3.6.30 => 3.6.30 @tarojs/plugin-platform-h5: 3.6.30 => 3.6.30 @tarojs/plugin-platform-jd: 3.6.30 => 3.6.30 @tarojs/plugin-platform-qq: 3.6.30 => 3.6.30 @tarojs/plugin-platform-swan: 3.6.30 => 3.6.30 @tarojs/plugin-platform-tt: 3.6.30 => 3.6.30 @tarojs/plugin-platform-weapp: 3.6.30 => 3.6.30 @tarojs/react: 3.6.30 => 3.6.30 @tarojs/runtime: 3.6.30 => 3.6.30 @tarojs/shared: 3.6.30 => 3.6.30 @tarojs/taro: 3.6.30 => 3.6.30 @tarojs/taro-loader: 3.6.30 => 3.6.30 @tarojs/webpack5-runner: 3.6.30 => 3.6.30 babel-preset-taro: 3.6.30 => 3.6.30 eslint-config-taro: 3.6.30 => 3.6.30 react: ^18.0.0 => 18.3.1

System: OS: macOS 13.3.1 CPU: (24) x64 13th Gen Intel(R) Core(TM) i7-13700KF Memory: 9.21 GB / 32.00 GB Shell: 5.9 - /bin/zsh Binaries: Node: 16.20.2 - ~/.nvm/versions/node/v16.20.2/bin/node Yarn: 1.22.19 - ~/.nvm/versions/node/v16.20.2/bin/yarn npm: 8.19.4 - ~/.nvm/versions/node/v16.20.2/bin/npm pnpm: 8.6.12 - ~/.nvm/versions/node/v16.20.2/bin/pnpm Watchman: 2023.12.04.00 - /usr/local/bin/watchman Browsers: Chrome: 127.0.6533.89 Safari: 16.4

其他补充信息

No response

160905 commented 3 months ago

image 更新版本后,我这种写法无法设置 form 值和preview

agooddream commented 3 months ago

补充一条,微信小程序下上传成功后,files为空,切到2.5.2成才有

160905 commented 3 months ago

补充一条,微信小程序下上传成功后,files为空,切到2.5.2成才有

我这里目前使用的版本是 "@nutui/nutui-react-taro": "^2.6.11", 我这边要降 version 才可以是吗

agooddream commented 3 months ago

补充一条,微信小程序下上传成功后,files为空,切到2.5.2成才有

我这里目前使用的版本是 "@nutui/nutui-react-taro": "^2.6.11", 我这边要降 version 才可以是吗

降到2.6.10 就可以了

160905 commented 3 months ago

如果固定到这个版本。之后的版本更新新功能我岂不是用不上了。

xiaoyatong commented 2 months ago

如果固定到这个版本。之后的版本更新新功能我岂不是用不上了。

file问题应该是解决的了~