如何使用 material-ui-dropzone

问题描述

我正在使用 material-ui-dropzone 上传多个文件。

有没有办法改变每个文件的图标或图标的颜色？

请给我解决这个问题的建议。

现状——

代码示例 - Link

解决方法

首先，如果您看到文档中的示例 https://react-dropzone.js.org/#section-previews

不要使用缩略图，而是使用 Material UI 中的图标并以编程方式更新颜色。

创建一个调色板或一个以编程方式返回 RGB 的函数。然后在挂载图标组件时根据文件的数量为每个图标分配颜色。

对于简单的，只需创建一个带有颜色值的数组：

const colorPallet = ['red','yello','green',... ]

并在样式 <FileClipIcon style={{ color: colorPallet[index] }} />

中指定颜色

否则编写一个函数，返回 0 到 255 之间的随机 RGB 值并使用它。