diff --git a/components/upload/UploadList.tsx b/components/upload/UploadList.tsx
index 75f51211c4..af2d146d38 100644
--- a/components/upload/UploadList.tsx
+++ b/components/upload/UploadList.tsx
@@ -8,17 +8,7 @@ import Progress from '../progress';
 import { ConfigConsumer, ConfigConsumerProps } from '../config-provider';
 
 const imageTypes: string[] = ['image', 'webp', 'png', 'svg', 'gif', 'jpg', 'jpeg', 'bmp', 'dpg'];
-// https://developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsDataURL
-export const previewFile = (file: File | Blob, callback: Function) => {
-  if (file.type && !imageTypes.includes(file.type)) {
-    callback('');
-  }
-  const reader = new FileReader();
-  reader.onloadend = () => callback(reader.result);
-  reader.readAsDataURL(file);
-};
-
-export const extname = (url: string) => {
+const extname = (url: string) => {
   if (!url) {
     return '';
   }
@@ -72,6 +62,16 @@ export default class UploadList extends React.Component<UploadListProps, any> {
     return onPreview(file);
   };
 
+  // https://developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsDataURL
+  previewFile = (file: File | Blob, callback: Function) => {
+    if (file.type && !imageTypes.includes(file.type)) {
+      callback('');
+    }
+    const reader = new FileReader();
+    reader.onloadend = () => callback(reader.result);
+    reader.readAsDataURL(file);
+  };
+
   componentDidUpdate() {
     if (this.props.listType !== 'picture' && this.props.listType !== 'picture-card') {
       return;
@@ -88,7 +88,7 @@ export default class UploadList extends React.Component<UploadListProps, any> {
         return;
       }
       file.thumbUrl = '';
-      previewFile(file.originFileObj, (previewDataUrl: string) => {
+      this.previewFile(file.originFileObj, (previewDataUrl: string) => {
         file.thumbUrl = previewDataUrl;
         this.forceUpdate();
       });
diff --git a/components/upload/__tests__/uploadlist.test.js b/components/upload/__tests__/uploadlist.test.js
index 65ae5c8c95..c49ac6b7b7 100644
--- a/components/upload/__tests__/uploadlist.test.js
+++ b/components/upload/__tests__/uploadlist.test.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import { mount } from 'enzyme';
 import Upload from '..';
-import UploadList, { previewFile, extname } from '../UploadList';
+import UploadList from '../UploadList';
 import Form from '../../form';
 import { errorRequest, successRequest } from './requests';
 import { setup, teardown } from './mock';
@@ -359,12 +359,20 @@ describe('Upload List', () => {
   it('previewFile should work correctly', () => {
     const callback = jest.fn();
     const file = new File([''], 'test.txt', { type: 'text/plain' });
-    previewFile(file, callback);
+    const items = [{ uid: 'upload-list-item', url: '' }];
+    const wrapper = mount(
+      <UploadList listType="picture-card" items={items} locale={{ previewFile: '' }} />,
+    ).instance();
+    wrapper.previewFile(file, callback);
     expect(callback).toBeCalled();
   });
 
-  it('extname should work correctly', () => {
-    expect(extname()).toBe('');
+  it('extname should work correctly when url not exists', () => {
+    const items = [{ uid: 'upload-list-item', url: '' }];
+    const wrapper = mount(
+      <UploadList listType="picture-card" items={items} locale={{ previewFile: '' }} />,
+    );
+    expect(wrapper.find('.ant-upload-list-item-thumbnail').length).toBe(2);
   });
 
   it('when picture-card is loading, icon should render correctly', () => {