mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2025-04-18 14:50:56 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(upload): can't upload

Browse Source
This commit is contained in:
07akioni 2021-09-20 23:38:12 +08:00
parent aa090cd6ef
commit ac85b32eda
24 changed files with 55 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.en-US.md
View File

@ -8,6 +8,7 @@
- Fix `n-tree` replace `leafOnly` prop to `checkStrategy` prop in single check.
- Fix `n-upload`'s trigger is compressed in `image-card` mode when it's the only item in the row.
- Fix `n-upload-dragger` has no border transition.
- Fix `n-upload` can't upload files.
## 2.19.0 (2021-09-19)

1
CHANGELOG.zh-CN.md
View File

@ -8,6 +8,7 @@
- 修复 `n-tree` 的 `checkStrategy` 属性单选替换 `leafOnly` 属性
- 修复 `n-upload` 在 `image-card` 模式下触发区域作为一行唯一元素时被压缩
- 修复 `n-upload-dragger` 边框缺乏过渡
- 修复 `n-upload` 无法上传文件
## 2.19.0 (2021-09-19)

5
build/loaders/convert-md-to-demo.js
View File

@ -4,6 +4,8 @@ const path = require('path')
const createRenderer = require('./md-renderer')
const mdRenderer = createRenderer()
const __HTTP__ = process.env.NODE_ENV !== 'production' ? 'http' : 'https'
const demoBlock = fs
.readFileSync(path.resolve(__dirname, 'ComponentDemoTemplate.vue'))
.toString()
@ -137,6 +139,9 @@ function genVueComponent (parts, fileName, relativeUrl, noRunning = false) {
if (parts.template) {
src = src.replace(demoReg, parts.template)
}
if (/__HTTP__/.test(src)) {
src = src.replace(/__HTTP__/g, __HTTP__)
}
return src.trim()
}

2
src/upload/demos/enUS/abstract.demo.md
View File

@ -8,7 +8,7 @@ Set `abstract` on `n-upload`.
<n-upload
abstract
:default-file-list="fileList"
action="http://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
>
<n-button-group>
<n-button>Useless</n-button>

2
src/upload/demos/enUS/basic.demo.md
View File

@ -2,7 +2,7 @@
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:headers="{
'naive-info': 'hello!'
}"

2
src/upload/demos/enUS/before-upload.demo.md
View File

@ -4,7 +4,7 @@ Use `before-upload` to prevent uploading.
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
@before-upload="beforeUpload"
>
<n-button>Upload PNG</n-button>

4
src/upload/demos/enUS/controlled.demo.md
View File

@ -4,7 +4,7 @@ Example is only a joke.
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
v-model:file-list="fileList"
@update:file-list="handleFileListChange"
@change="handleUploadChange"
@ -25,7 +25,7 @@ export default defineComponent({
{
id: 'url-test',
name: 'URL Test',
url: 'https://www.mocky.io/v2/5e4bafc63100007100d8b70f',
url: '__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f',
status: 'finished'
},
{

2
src/upload/demos/enUS/default-files.demo.md
View File

@ -2,7 +2,7 @@
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:default-file-list="defaultFileList"
>
<n-button>Upload File</n-button>

2
src/upload/demos/enUS/drag.demo.md
View File

@ -1,7 +1,7 @@
# Drag to Upload
```html
<n-upload action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f">
<n-upload action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f">
<n-upload-dragger>
<div style="margin-bottom: 12px;">
<n-icon size="48" :depth="3">

10
src/upload/demos/enUS/image-card-style.demo.md
View File

@ -6,7 +6,7 @@ The preview in the photo wall will call the internal preview component by defaul
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:default-file-list="fileList"
list-type="image-card"
>
@ -14,7 +14,7 @@ The preview in the photo wall will call the internal preview component by defaul
</n-upload>
<n-divider />
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:default-file-list="previewFileList"
list-type="image-card"
@preview="handlePreview"
@ -64,7 +64,7 @@ export default defineComponent({
id: 'c',
name: '我是自带url的图片.png',
status: 'finished',
url: 'https://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
url: '__HTTP__://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
},
{
id: 'd',
@ -78,13 +78,13 @@ export default defineComponent({
id: 'react',
name: '我是react.png',
status: 'finished',
url: 'https://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
url: '__HTTP__://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
},
{
id: 'vue',
name: '我是vue.png',
status: 'finished',
url: 'https://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
url: '__HTTP__://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
}
])
}

6
src/upload/demos/enUS/image-style.demo.md
View File

@ -6,7 +6,7 @@ You can use `preview-file` to customize the thumbnails of the file.
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:default-file-list="fileList"
list-type="image"
:createThumbnailUrl="createThumbnailUrl"
@ -38,7 +38,7 @@ export default defineComponent({
id: 'c',
name: 'image.png',
status: 'finished',
url: 'https://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
url: '__HTTP__://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
},
{
id: 'd',
@ -55,7 +55,7 @@ export default defineComponent({
h('br'),
'It will be 07akioni whatever you upload.'
])
return 'https://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
return '__HTTP__://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
}
}
}

4
src/upload/demos/enUS/on-finish.demo.md
View File

@ -5,7 +5,7 @@ You can change file's property when upload finishes.
```html
<n-upload
@finish="handleFinish"
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
>
<n-button>Upload</n-button>
</n-upload>
@ -20,7 +20,7 @@ export default defineComponent({
const message = useMessage()
const handleFinish = ({ file, event }) => {
message.success(event.target.response)
file.url = 'https://www.mocky.io/v2/5e4bafc63100007100d8b70f'
file.url = '__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f'
}
return {
message,

2
src/upload/demos/enUS/submit-manually.demo.md
View File

@ -12,7 +12,7 @@ You can use `submit` method to submit in uncontrolled manner. Also you can do it
</n-button>
<n-upload
@change="handleChange"
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:default-upload="false"
multiple
ref="upload"

2
src/upload/demos/zhCN/abstract.demo.md
View File

@ -8,7 +8,7 @@
<n-upload
abstract
:default-file-list="fileList"
action="http://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
>
<n-button-group>
<n-button>点我没用</n-button>

2
src/upload/demos/zhCN/basic.demo.md
View File

@ -2,7 +2,7 @@
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:headers="{
'naive-info': 'hello!'
}"

2
src/upload/demos/zhCN/before-upload.demo.md
View File

@ -4,7 +4,7 @@
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
@before-upload="beforeUpload"
>
<n-button>上传 PNG 文件</n-button>

4
src/upload/demos/zhCN/controlled.demo.md
View File

@ -4,7 +4,7 @@
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
v-model:file-list="fileList"
@change="handleUploadChange"
@remove="handleRemove"
@ -25,7 +25,7 @@ export default defineComponent({
{
id: 'url-test',
name: 'URL 测试',
url: 'https://www.mocky.io/v2/5e4bafc63100007100d8b70f',
url: '__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f',
status: 'finished'
},
{

2
src/upload/demos/zhCN/default-files.demo.md
View File

@ -2,7 +2,7 @@
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:default-file-list="defaultFileList"
>
<n-button>上传文件</n-button>

2
src/upload/demos/zhCN/drag.demo.md
View File

@ -1,7 +1,7 @@
# 拖拽上传
```html
<n-upload action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f">
<n-upload action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f">
<n-upload-dragger>
<div style="margin-bottom: 12px;">
<n-icon size="48" :depth="3">

10
src/upload/demos/zhCN/image-card-style.demo.md
View File

@ -6,7 +6,7 @@
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:default-file-list="fileList"
list-type="image-card"
>
@ -14,7 +14,7 @@
</n-upload>
<n-divider />
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:default-file-list="previewFileList"
list-type="image-card"
@preview="handlePreview"
@ -64,7 +64,7 @@ export default defineComponent({
id: 'c',
name: '我是自带url的图片.png',
status: 'finished',
url: 'https://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
url: '__HTTP__://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
},
{
id: 'd',
@ -78,13 +78,13 @@ export default defineComponent({
id: 'react',
name: '我是react.png',
status: 'finished',
url: 'https://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
url: '__HTTP__://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
},
{
id: 'vue',
name: '我是vue.png',
status: 'finished',
url: 'https://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
url: '__HTTP__://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
}
])
}

6
src/upload/demos/zhCN/image-style.demo.md
View File

@ -6,7 +6,7 @@
```html
<n-upload
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:default-file-list="fileList"
list-type="image"
:create-thumbnail-url="createThumbnailUrl"
@ -38,7 +38,7 @@ export default defineComponent({
id: 'c',
name: '图片.png',
status: 'finished',
url: 'https://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
url: '__HTTP__://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
},
{
id: 'd',
@ -53,7 +53,7 @@ export default defineComponent({
message.info(
'createThumbnailUrl 产生了图片的 URL，你传什么都会变成 07akioni'
)
return 'https://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
return '__HTTP__://07akioni.oss-cn-beijing.aliyuncs.com/07akioni.jpeg'
}
}
}

4
src/upload/demos/zhCN/on-finish.demo.md
View File

@ -5,7 +5,7 @@
```html
<n-upload
@finish="handleFinish"
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
>
<n-button>上传文件</n-button>
</n-upload>
@ -20,7 +20,7 @@ export default defineComponent({
const message = useMessage()
const handleFinish = ({ file, event }) => {
message.success(event.target.response)
file.url = 'https://www.mocky.io/v2/5e4bafc63100007100d8b70f'
file.url = '__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f'
}
return {
message,

2
src/upload/demos/zhCN/submit-manually.demo.md
View File

@ -12,7 +12,7 @@
</n-button>
<n-upload
@change="handleChange"
action="https://www.mocky.io/v2/5e4bafc63100007100d8b70f"
action="__HTTP__://www.mocky.io/v2/5e4bafc63100007100d8b70f"
:default-upload="false"
multiple
ref="upload"

23
src/upload/src/Upload.tsx
View File

@ -338,24 +338,25 @@ export default defineComponent({
}
return null
})
).then((fileInfos) => {
let nextTickChain = Promise.resolve()
)
.then(async (fileInfos) => {
let nextTickChain = Promise.resolve()
fileInfos.forEach((fileInfo) => {
nextTickChain = nextTickChain
// eslint-disable-next-line @typescript-eslint/promise-function-async
.then(() => nextTick())
.then(() => {
fileInfos.forEach((fileInfo) => {
nextTickChain = nextTickChain.then(nextTick as any).then(() => {
fileInfo &&
doChange(fileInfo, e, {
append: true
})
})
})
return await nextTickChain
})
.then(() => {
if (props.defaultUpload) {
submit()
}
})
if (props.defaultUpload) {
submit()
}
})
}
function submit (fileId?: string): void {
const {