diff --git a/src/uploader/index.js b/src/uploader/index.js index e041568eb..ce60a49a3 100644 --- a/src/uploader/index.js +++ b/src/uploader/index.js @@ -1,5 +1,5 @@ // Utils -import { createNamespace, addUnit, noop, isPromise } from '../utils'; +import { createNamespace, addUnit, noop, isPromise, isDef } from '../utils'; import { toArray, readFile, isOversize, isImageFile } from './utils'; // Mixins @@ -147,7 +147,7 @@ export default createComponent({ Promise.all(files.map((file) => readFile(file, this.resultType))).then( (contents) => { const fileList = files.map((file, index) => { - const result = { file, status: '' }; + const result = { file, status: '', message: '' }; if (contents[index]) { result.content = contents[index]; @@ -161,7 +161,7 @@ export default createComponent({ ); } else { readFile(files, this.resultType).then((content) => { - const result = { file: files, status: '' }; + const result = { file: files, status: '', message: '' }; if (content) { result.content = content; @@ -260,7 +260,7 @@ export default createComponent({ }, genPreviewMask(item) { - const { status } = item; + const { status, message } = item; if (status === 'uploading' || status === 'failed') { const MaskIcon = @@ -270,12 +270,12 @@ export default createComponent({ ); + const showMessage = isDef(message) && message !== ''; + return (
{MaskIcon} - {item.message && ( -
{item.message}
- )} + {showMessage &&
{message}
}
); } diff --git a/src/uploader/test/__snapshots__/index.spec.js.snap b/src/uploader/test/__snapshots__/index.spec.js.snap index c14e92c84..2e8bf4f7c 100644 --- a/src/uploader/test/__snapshots__/index.spec.js.snap +++ b/src/uploader/test/__snapshots__/index.spec.js.snap @@ -18,6 +18,25 @@ exports[`disable preview image 1`] = ` `; +exports[`file message should be reactive 1`] = ` +
+
+
+
+
+
+
+
+
+
2
+
+
+
+
+
+
+`; + exports[`image-fit prop 1`] = `
diff --git a/src/uploader/test/index.spec.js b/src/uploader/test/index.spec.js index 1c59252b1..7a7b6ed50 100644 --- a/src/uploader/test/index.spec.js +++ b/src/uploader/test/index.spec.js @@ -463,3 +463,27 @@ test('show-upload prop', () => { wrapper.setProps({ showUpload: false }); expect(wrapper.contains('.van-uploader__upload')).toBeFalsy(); }); + +test('file message should be reactive', (done) => { + const wrapper = mount(Uploader, { + propsData: { + fileList: [], + afterRead(file) { + file.status = 'uploading'; + file.message = 1; + setTimeout(() => { + file.message = 2; + expect(wrapper).toMatchSnapshot(); + done(); + }); + }, + }, + listeners: { + input(fileList) { + wrapper.setProps({ fileList }); + }, + }, + }); + + wrapper.vm.onChange(file); +});