Question

我希望能够下载图像/文件。我在想这个的方式就像悬停在图像上时的删除按钮。当图像从服务器渲染时，理想的是下载图标。我的想法是这样的

<a href={srcValue} download>

并包装img标签。并分别用于文件。那么有没有更好的方法来做这个而不是覆盖所有文件（FileInput，FileInputPreview，ImageInput，ImageField等）

谢谢！

Answer 1

你可以试试这个。

export const Something = (props) => {
  return (
    <List {...props} >
      <Datagrid>
        <ReferenceField label="Get Image" source="id" reference="pathToImage" linkType={false} >
          <ImageLink />
        </ReferenceField>
      </Datagrid>
    </List>
  )
}

const ImageLink = ({record}) => {
  return (
    <a href={config.staticHost + '/' + record.nameOnDisk} target="_blank" download >
      <FlatButton label="Download" />
    </a>
  )
}

如果您的记录包含图像的URL，则可以跳过ReferenceField。您只需将记录中的URL传递给它，而不是整个记录。

如何使图像/文件可下载

1 个答案: