{
console.log(index, file);
};
+ },
+
+ toastName(file, detail) {
+ this.$toast(detail.name);
}
}
};
diff --git a/packages/uploader/en-US.md b/packages/uploader/en-US.md
index b758a006d..c1b1caed4 100644
--- a/packages/uploader/en-US.md
+++ b/packages/uploader/en-US.md
@@ -29,7 +29,26 @@ export default {
};
```
-#### Set input attr
+#### Name
+
+```html
+
+
+
+```
+
+```javascript
+export default {
+ methods: {
+ onRead(file, detail) {
+ this.$toast(detail.name);
+ }
+ }
+};
+```
+
+#### Set input attrs
+
You can set native properties such as `accpet`、`multiple` on Uploader, and the input will automatically inherits the attribute.
```html
@@ -42,6 +61,7 @@ You can set native properties such as `accpet`、`multiple` on Uploader, and the
| Attribute | Description | Type | Default |
|------|------|------|------|
+| name | Input name | `String` | - |
| result-type | Type of file read result, can be set to `dataUrl` `text` | `String` | `dataUrl` |
| accept | Accepted file type | `String` | `image/*` |
| disabled | Whether to disabled the upload | `Boolean` | `false` |
@@ -61,9 +81,9 @@ You can set native properties such as `accpet`、`multiple` on Uploader, and the
|------|------|
| - | Custom icon |
-### afterRead Parematers
+### Parematers of before-read、after-read
| Attribute | Description | Type |
|------|------|------|
-| file | file object | `Object` |
-| content | file content | `String` |
+| file | File object | `Object` |
+| detail | Detail info | `Object` |
diff --git a/packages/uploader/index.js b/packages/uploader/index.js
index b98f70da9..6544ba36f 100644
--- a/packages/uploader/index.js
+++ b/packages/uploader/index.js
@@ -23,6 +23,14 @@ export default sfc({
}
},
+ computed: {
+ detail() {
+ return {
+ name: this.$attrs.name || ''
+ };
+ }
+ },
+
methods: {
onChange(event) {
let { files } = event.target;
@@ -31,7 +39,7 @@ export default sfc({
}
files = files.length === 1 ? files[0] : [].slice.call(files, 0);
- if (!files || (this.beforeRead && !this.beforeRead(files))) {
+ if (!files || (this.beforeRead && !this.beforeRead(files, this.detail))) {
this.resetInput();
return;
}
@@ -82,7 +90,7 @@ export default sfc({
if (oversize) {
this.$emit('oversize', files);
} else {
- this.afterRead && this.afterRead(files);
+ this.afterRead && this.afterRead(files, this.detail);
}
this.resetInput();
},
diff --git a/packages/uploader/test/__snapshots__/demo.spec.js.snap b/packages/uploader/test/__snapshots__/demo.spec.js.snap
index 3be6adcd6..414e32331 100644
--- a/packages/uploader/test/__snapshots__/demo.spec.js.snap
+++ b/packages/uploader/test/__snapshots__/demo.spec.js.snap
@@ -8,6 +8,12 @@ exports[`renders demo correctly 1`] = `
+
diff --git a/packages/uploader/test/index.spec.js b/packages/uploader/test/index.spec.js
index b0891f82f..289fcb501 100644
--- a/packages/uploader/test/index.spec.js
+++ b/packages/uploader/test/index.spec.js
@@ -48,6 +48,24 @@ it('read text', done => {
wrapper.vm.onChange(file);
});
+it('set input name', done => {
+ const wrapper = mount(Uploader, {
+ propsData: {
+ name: 'uploader',
+ beforeRead: (readFile, detail) => {
+ expect(detail.name).toEqual('uploader');
+ return true;
+ },
+ afterRead: (readFile, detail) => {
+ expect(detail.name).toEqual('uploader');
+ done();
+ }
+ }
+ });
+
+ wrapper.vm.onChange(file);
+});
+
it('unknown resultType', () => {
const afterRead = jest.fn();
const wrapper = mount(Uploader, {
diff --git a/packages/uploader/zh-CN.md b/packages/uploader/zh-CN.md
index fba40e88a..d3c25e9aa 100644
--- a/packages/uploader/zh-CN.md
+++ b/packages/uploader/zh-CN.md
@@ -27,7 +27,26 @@ export default {
};
```
+#### 标识名称
+
+```html
+
+
+
+```
+
+```javascript
+export default {
+ methods: {
+ onRead(file, detail) {
+ this.$toast(detail.name);
+ }
+ }
+};
+```
+
#### 设置 Input 属性
+
可以直接在 Uploader 上设置 accpet、multiple 等原生属性,input 会自动继承该属性
```html
@@ -40,6 +59,7 @@ export default {
| 参数 | 说明 | 类型 | 默认值 | 版本 |
|------|------|------|------|------|
+| name | 标识符,可以在回调函数的第二项参数中获取 | `String` | - | 1.6.13 |
| result-type | 文件读取结果类型,可选值为 `text` | `String` | `dataUrl` | - |
| accept | 接受的文件类型 | `String` | `image/*` | - |
| disabled | 是否禁用图片上传 | `Boolean` | `false` | - |
@@ -59,9 +79,9 @@ export default {
|------|------|
| - | 自定义 uploader 内容 |
-### after-read 回调参数
+### before-read、after-read 回调参数
| 参数名 | 说明 | 类型 |
|------|------|------|
| file | 文件解析后的 file 对象 | `Object` |
-| content | 文件内容 | `String` |
+| detail | 额外信息,包含 name 字段 | `Object` |